Sunday, 25 October 2015

Reading Web Component Architecture and Development with AngularJS

Was Reading this book since our company is going to use AngularJS as the Front End development framework.

I have heard of AngularJS since last year. There was a small group meeting in which one of the group member Shalu presented the idea of rewriting the current EC Back Maintenance site with AngularJS. And it was immediately rejected by another senior member Lalith. As I have no idea of what AngularJS is (even after Shalu's presentation), I just listened their arguments and encountered the idea of "single page website". Lalith argued that the whole idea of AngularJS is to support "single page website", and the Back Site is far more complicated than that, therefore it is not a wise idea to rewrite everything in Angular.

Now I started to learn more about Angular and what is the problem this framework tries to solve. And then I realize it IS a very good framework to adopt. It actually prepared us to ECMA 7 which supports Web Component. From reading the 1st chapter, I understood the history and evolution of front end framework. Long long time ago, there is no need for JS as pages are mostly static with links to other pages. JS is only needed for things like form validations. Then here comes the change. Web sites would like to provide more interactive contents. And web application needs more business logic to be implemented in Front End. However the original HTML is not designed for displaying dynamic content. Therefore JS becomes more heavier and increasingly harder to maintain. And we need a school of thought to follow and here comes the MV*.

I think MV* are set-upped with JS. Those set-ups are called boilerplate code. It involves events registration and linking data(model) with views. The problem is those boilerplate code polluted the business logic code. By right business logic(application specific. Usually will be at the Back End) or control logic(page behavior specific) should be completely separated from the data(model) and view, so that they can be reusable.

Example of control logic will be Tab behavior.

Angular JS removed boilerplate code from JS (although they are probably still use JS to achieve the effect), so we can concentrate more on control and business logic. That is the take away I got from reading the 1st chapter.