What is Angular js? First steps to learn it

What is Angular js? First steps to learn it

According to WebEsperto “AngularJS is an MVC JavaScript framework for Front End Web Development that allows you to create SPA Applications Single-Page Applications. It enters the family of frameworks like BackboneJS or EmberJS.”

With so many frameworks, it is difficult to choose which one to use in our applications, what advantages they have in front of others, etc. In this post I will comment that makes AngularJS different from the rest and a few links to online resources where to learn to use this framework and catch fluency.

Previously on the front end of web applications we only had jQuery (in addition to other similar libraries like Mootools, Prototype …) to help us with the client’s JavaScript code. We could manipulate the DOM in a simpler way, add effects, call AJAX, etc.  but we did not have a pattern to follow. The whole JS code was in functions that we were creating as we needed, which caused the code to be difficult to manage over time and become the dreaded Spaguetti Code.

Luckily, there were frameworks that implemented the MVC (Model, View, and Controller) pattern and helped us to separate concepts. The best known is BackboneJS, which came out in 2010 created by Jeremy Ashkenas (Creator also of Coffee Script) and depends on 2 other libraries: jQuery and Underscore.js It is used by multiple Start-ups like Pinterest, Foursquare , AirBnB , Trello , etc.

BackboneJS allows you to create your app quickly but sometimes it is complicated to use. Most developers choose BackboneJS because it seems the safest option, it takes more time between us, there is a lot of documentation about it and it is maintained by a large community.

However AngularJS is stepping. Although its first version is from 2009, it has become very popular in late 2012 and now in 2013 is booming. While there is talk of a new technology stack as it was before LAMP ( L inux + A Pache + M ySQL + P HP) now the trend is MEAN ( M ongoDB / M ongoose + E xpressJS + A ngularJS + N odeJS), which Which also translates to End-to-End JavaScript applications . AngularJS is maintained by Google and quite community.

Here is an example of how the MVC pattern in AngularJS is implemented:

//Model: Objetos JavaScript

$scope.files = [‘foo’,’bar’, ‘baz’];

<!– View: HTML –>

<div ng-repeat=”f in files”></div>

//Controller: Código Javascript

function addFile(fileName){

$scope.files.push(fileName);

}

Which results in:

foo 

bar 

baz 

AngularJS allows you to extend the HTML vocabulary with directives and attributes, maintaining the semantics and without having to use external libraries like jQuery or Underscore.js to make it work.