Wednesday, January 14, 2015

Getting started with AngularJs

I have been working as UI developer for previous 7 years on various projects with server side languages like Java, .net, PHP. Seriously telling you before jumping into AngularJs my UI developer life was very easy, but as soon as I adopted AngularJs my work load and responsibilities increased more than double. AngularJs has reduced server side coding and made it possible to manage lots of backend efforts on frontend, but working on AngularJs is really a great experience. I bet after learning AngularJs you'll forget other scripting languages.

AngularJs has enabled us to communicate between server and client side without using JSP, XSLT, ASPX(.net) pages, AngularJs has made it as easy as developing a complete project with simple HTML, CSS and JavaScript.

AngularJS makes it incredibly easy to build web applications, it also makes it easy to build complex applications. AngularJS takes care of advanced features that users have become accustomed to in modern web applications, such as:
  • Separation of application logic, data models, and views
  • Ajax services
  • Dependency injection
  • Browser history (makes bookmarking and back/forward buttons work like normal web apps)
  • Testing
  • And more


How Is It different?

In other JavaScript frameworks, we are forced to extend from custom JavaScript objects and manipulate the DOM from the outside in. For instance, using jQuery, for

example suppose we have following HTML code, and we want to add the text 'Naren' to the span 'Hello' when entered the value in text box:
    <input id="name" type="text" />
    <span id="greeting">Hello</span>

Now look into jQuery way:
//look up the input element
var name = $('#name');
//look up the output element
var greeting = $('#greeting');
//listen for keyboard events
name.keyup(function() {
        //update the output element with the new input
        greeting.text('Hello ' + name.val());

Now with AngularJs:
<div ng-app>
    <input type="text" ng-model="name" />
    <span>Hello {{name}}</span>
That's it no more lines of extra script.

Readers! keep reading my posts there is lots of UI Developr stuff to be share with you.

2 days' AngularJs training classes are going on with me for professional UI Developers. You can enroll by a phone call at +91 987 143 3826 or eMail me at or visit