AngularJS Introduction

This post gives you basic Introduction of AngularJS and the motivation to use AngularJS in your projects.

What is AngularJS and Why at all?

It all started with JavaScript. Javascript is evolved from being just a scripting language used occasionally to perform client side validations to become a full-fledged programming language.

With Jquery, life gets way easier. It’s stable API tackles browser incompatibilities across tons of browser available around, and allows DOM manipulation on the fly.

But Jquery lacks something very important. It lacks structure, separation of concerns, testability, maintainability, and not so easy to understand. Notion of framework to develop modular applications upon seems missing. With ever increasing complexity, and sheer size of today’s applications, all jQuery projects looks completely different from one another as the developer himself tries to implement modularity and structure in his applications. Any new guy facing maintenance for those Jquery projects will have a hard time finding his way.

AngularJS was originated to fill this gap. AngularJS is a client side MVC framework, which provides a layer on top of jQuery. It provides a framework and api to develop modular applications upon, provides well defined structure to your applications, where separation of concerns is well maintained. Each functionality of project belongs to a specific concern(data, view, business-logic), and thus reduces development time by several fold, maintenance and testability becomes a breeze with modular architecture. In AngularJS, you can achieve the same functionality in couple of lines of code, which with JQuery might take hundreds of lines. AngularJS takes care of all boilerplate code, and let you focus on core business logic, and look-n-feel of your application.

AngularJS adheres MVC Pattern

AngularJS adheres a Model-View-Controller (MVC)-like pattern for structuring any application. There are three parts to any AngularJS application.

  • Model : Model is the data that you want to display to the user, or get the user to enter through your application. It is represented using JSON objects.
  • View : View is the User interface /rendered HTML that the user sees and interacts with, which displays the data to the user.
  • Controller : Controller handles the core business logic of your application. It decides which part of the model to show to the user, how to handle validation, perform business logic and so on.

AngularJS Advantages

  • Seperation Of Concerns (MVC)
  • Fewer lines of Code
  • Pure HTML templates
  • Testability
  • Smooth Integration with 3rd party libraries
If you like tutorials on this site, why not take a step further and connect me on Facebook , Google Plus & Twitter as well? I would love to hear your thoughts on these articles, it will help me improve further our learning process.

If you appreciate the effort I have put in this learning site, help me improve the visibility of this site towards global audience by sharing and linking this site from within and beyond your network. You & your friends can always link my site from your site on, and share the learning.

After all, we are here to learn together, aren’t we?