Angular.JS

Angular.JS

README

After months working with MVC Frameworks for JavaScript like BackBone.JS, Cappuccino, JavaScript-MVC, Ember.JS, HandleBars, Sammy.JS, Spine.JS I’ve decided that Angular.JS will be my choice for a long time since now. Why?, well that’s a good question, each technology has advantages and disadvantages so I won’t say Angular.JS it’s better than the others because they all have advantages that others do not have.

What it is?

Angular.JS is an open source project licensed under the MIT license and is supported by Google since 2010. It fits the definition of a framework the best, even though it’s much more lightweight than a typical framework and that’s why many confuse it with a library; it is 100% JavaScript, 100% client side and compatible with both desktop and mobile browsers. So it’s definitely not a plugin or some other native browser extension. The project is called AngularJS because HTML has angular brackets {...} and ng (its namespace) sounds like Angular.

Why Angular.JS

HTML is great for declaring static documents, but it falters when we try to use it for declaring dynamic views in web-applications. Angular.JS lets you extend HTML vocabulary for your application. The resulting environment is extraordinarily expressive, readable, and quick to develop.

Angular.JS is a toolset for building the framework most suited to our application development. It is fully extensible and works well with other libraries. Every feature can be modified or replaced to suit our unique development workflow and feature needs.

Features

Angular.js 1

Adding control:
  • Data-binding: An automatic way to update the view whenever the model changes, as well as updating the model whenever the view changes.
  • Controllers: They are the behavior behind the DOM elements.
  • Plain Javascript: Unlike other frameworks, there is no need to inherit from proprietary types; to wrap the model in accessors methods.
Wiring up the Backend:
  • Deep linking: This reflects where the user is in the app. Round trip apps get this automatically, but AJAX apps by their nature do not.
  • Form validation: Lets you declare the validation rules of the form without having to write JavaScript code.
  • Server comunication: They wrap XHR to give us exception management and promises. Promises further simplify our code by handling asynchronous return of data.
Creating components:
  • Directives: A unique and powerful feature available only in Angular.JS; it lets you invent new HTML syntax, specific to your application.
  • Reusable components: Allows you to hide complex DOM structure, CSS, and behavior.
  • Localization: Angular’s locale aware filters and stemming directives give you building blocks to make your application available in all locales.
Embed and Inject
  • Embeddable: Angular.JS works great with other technologies. Because Angular.JS has no global state, multiple apps can run on a single page without the use of iframes.
  • Injectable: The dependency injection in Angular.JS allows you to declaratively describe how your application is wired. This means that your application needs no main() method which is usually an unmaintainable mess.
  • Testable: Angular.JS was designed from ground up to be testable. It encourages behavior-view separation, comes pre-bundled with mocks, and takes full advantage of dependency injection. It also comes with end-to-end scenario runner which eliminates test flakiness by understanding the inner workings of it.
Template system

At the highest level, Angular.JS does look like a just another templating system, but there is one important reason why the Angular.JS templating system is different, that makes it very good fit for application development: bidirectional data binding. The template is compiled in the browser and the compilation step produces a live view; this means the developers don’t need to write code to constantly sync the view with the model and the model with the view as in other templating systems.

Security holes

Like any other technology, Angular.JS is not impervious to attack. Angular.JS does, however, provide built-in protection from basic security holes including XSS and HTML injection attacks. Angular.JS does round-trip escaping on all strings for you and even offers XSRF protection for server-side communication.

Also it was designed to be compatible with other security measures like Content Security Policy (CSP), HTTPS (SSL/TLS) and server-side authentication and authorization that greatly reduce the possible attack vectors.

jQuery library

Angular.JS can use jQuery if it’s present in the application when it is being bootstrapped, if jQuery is not present in the script path, Angular.JS falls back to its own implementation of the subset of jQuery that its called jQLite.

Credits

Angular.JS by Google, an HTML enhanced for web apps. Super-powered by Google © 2010-2012 Code licensed under the MIT License. Documentation licensed under CC BY 3.0. References: Angular.JS Google+ profile, Angular.JS Youtube channel, EggHead.io Youtube channel, Angular.JS CheatSheet

Angular.JS official project website.

Do you have a project idea? Let's make it together!