Saturday, July 13, 2013

AngularJS overview

This is very high level introduction to what Angular is, and how it is different from any other javascript framework.

If you go to the home page of Angular the very first line explains it -
"AngularJS is a structural framework for dynamic web apps"
but what does it mean? Well the first impression comes to our mind when we think about Angular JS as a javascript library is, we already have many libraries (JQuery) available in javascript, which are very mature and very well adapted by the market, then why do we need a new one. Is there any advantage of Angular over JQuery? Well the answer would be NO.
Its not because Angular is not powerful, it is because JQuery and Angular serves different purpose. To achieve fully functional we app in Javascript, you might need to use Angular and JQuery together.

The question remain same, why Angular?
There is very good paragraph on Angular official web site -

The impedance mismatch between dynamic applications and static documents is often solved with:
  • a library - a collection of functions which are useful when writing web apps. Your code is in charge and it calls into the library when it sees fit. E.g., jQuery.
  • frameworks - a particular implementation of a web application, where your code fills in the details. The framework is in charge and it calls into your code when it needs something app specific. E.g., knockoutember, etc.
Angular takes another approach. It attempts to minimize the impedance mismatch between document centric HTML and what an application needs by creating new HTML constructs. Angular teaches the browser new syntax through a construct we call directives
Angular provides you an inbuilt MVC pattern for your client side application. you can have view,model and Controller in your javascript(Which is ofcourse not provided by core javascript).

Controller code you write in javascript(Or JQuery) and update the model. Angular framework takes the responsibility of updating the view for you.

Angular provide you a way by which you can make static HTML to be dynamic(using {{}} tag).
It allows you to attach code behind with the DOM element.

you can create your own customized tags,attributes for your application and provide them different behavior.

It allows you to write HTML component which can be reusable in different applications.

No comments:

Post a Comment