Introduction to AngularJs

Introduction to AngularJS, HTML Redefined
 
HTML, as we all know, is the core component to build any application for the web.

The use of HTML, although, constrains us to make static web pages only. But come on, living in this world where static content is of very limited use, we definitely need an aid to present dynamic data for the rest of the world and ourselves. This is where AngularJS comes in, to redefine the use of HTML in building dynamic web applications that are responsive.

What does "responsive" mean ?

The answer has already been experienced by you, if not known!

In a standard web application, where one can navigate to other pages, on clicking a link, there is a certain pause before the new page pops up in front of us. To be exact, this pause is the time delay caused when our browser waits for the server to respond to our request of a different web page and its other dependencies. This new page is displayed only when the response from the sever is received.

In an AngularJS application, the routing service enables us to minimize this "pause" to be nearly unnoticeable. The user is presented with new content in a blink of an eye, which is only possible if the usual boilerplate procedure of rendering the entire page is avoided. This is done by AngularJS and this is what I exactly meant when I talked about making web applications that are "responsive". This owes completely to the fact that AngularJS works on the principle of the Model-View-Controller (MVC) pattern.

So this explanation answers the simple question of "Why AngularJS?", before even asking!

Any prerequisites?

Yes, but minimal.

AngularJS requires a prior knowledge of HTML, CSS and JavaScript.

A little testing knowledge will not go unfired because AngularJS is designed to be tested easily from the ground up.

What you don't need is the knowledge of any server-side language like PHP, Python and so on because AngularJS is totally meant for running in the client side of an application.

Summing up, if you are using JavaScript to create a dynamic website, AngularJS is a good choice!
  1. AngularJS helps you organize your JavaScript.
  2. AngularJS helps create responsive(fast) websites.
  3. AngularJS plays well with jQuery.
  4. AngularJS is easy to test.

While I come up with another extension on this topic, I will leave you all with just a cute little example of AngularJS to try out and get the feel of AngularJS.

  1. <!doctype html>  
  2. <html ng-app>  
  3.    <head>  
  4.    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.0-beta.13/angular.min.js"></script>  
  5.    </head>  
  6.    <body>  
  7.       <div>  
  8.          <label>Name:</label>  
  9.          <input type="text" ng-model="yourName" placeholder="Enter a name here">  
  10.          <hr>  
  11.          <h1>Hello {{yourName}}!</h1>  
  12.       </div>  
  13.    </body> 
  14. </html>  
Next Article: AngularJS - Basics: Part 2


Similar Articles