Angular JS
  Melvin       January 30, 2020
AngularJS, commonly called Angular, is an open-source web application framework in javascript. It is developed in 2009 by Misko Havery and Adam Abrons and now maintained by Google.
AngularJS components
The framework can be divided into 3 major parts:
Ng-app:
This directive defines and links an Angular application to HTML
Ng-model:
This directive binds the values of AngularJS application data to HTML output controls
Ng-bind:
binds the application data to HTML tags
Execution
When the page is loaded in the browser:
An HTML document is loaded into the browser, and evaluated by the browser. AngularJS javascript file is loaded, the angular global object is created. Next, javascript which registers controller functions is executed.
Next AngularJS scans through the HTML to look for AngularJS applications and views. One view is located, it connects the view to the corresponding controller function.
Next, AngularJS executes the controller functions, it then renders views with data from the model populated by the controller.
Core features
Data binding:
It is the automatic synchronization of data between model and view components
Scope:
These are objects that refer to the model. They act as glue between controller and view. All properties found on the scope object are automatically bound to the view by Angular. i.e, Angular quietly watches for changes to these properties and updates the view automatically
Controller:
These are javascript functions that are bound to a particular scope
Services:
Controllers in Angular are simple functions that have one job only, which is to manipulate the scope. Eg. You can use a controller to prefill data into the scope from the server or implement business logic validations. ‘Services’ help controller to do this. Most of the time it synchronizes up to a server to an offline data store and exposes methods to pull and push data to and from a server. Angular has several built-in services. Eg. $https; to make a XMLHttpRequest.
Directives:
They bring additional functionality to HTML. We never have to manipulate the DOM to simulate them. All that our application needs to do is to assign attributes to elements to get any functionality. How the view behaves is up to the directives
Templates:
These are the rendered view with information from the controller and model.
Routing:
It is the concept of switching views i.e ngRoute module routes your application to different pages without reloading the entire application
Model View Whatever:
Angular is now closer to MVVM - the $scope object could be considered the ViewModel that is being decorated by a function that we call a controller. Whatever stands for ‘Whatever works for you’
Deep Linking:
This allows us to encode the state of an application in the URL so it can be bookmarked. The application can then be restored from the URL to the same state
Dependency Injection:
This specifies a design pattern in which components are given dependencies instead of hard coding them within the component
Advantages
Data binding provides users a rich and responsive experience
The developer can write less code and get more functionality. Less code cause fewer bugs
Angular is cross-browser compliant i.e it handles automatically javascript code suitable for each browser
The main advantage is that it is maintained by Google
Disadvantages
Not secure:
Application written in AngularJS is not safe. Server-side authentication and authorization is must to keep an application secure
Not degradable:
If your application user disables javascript, then the user will see the basic page and nothing more
Lagging UI:
If there are more than 2000 watchers, it can get the UI to severely lag. This means that the possible complexity of Angular forms is limited
Name Clashes:
You don’t have the ability to compose many ng-apps on the same page. This can cause name clashes
Examples of popular applications that use AngularJS
Video streaming applications:
YouTube’s application for Sony PS3, Netflix.com
User-Review Applications:
Mobile site of GoodFilms that offers movie reviews to users
Weather Applications:
weather broadcasting application weather.com
User-generated content portals:
Freelancer.com, which is a platform for employees to post their projects and interested candidates need to present their profiles for it.
eCommerce:
Several eCommerce sites use AngularJS
Conclusion
AngularJS applications follow the well established MVC design pattern and implement it with the help of HTML5 templates, external web services as the data sources and javascript logic that glues everything together