Why AngularJs1

Estimated reading time: 20 minutes

AngularJS is one of the most popular UI MVC(MV*) frameworks. It did become popular due to a lot of reasons.

Let’s discuss the top reasons, why to choose AngualrJS over others.

Easy to get started

Getting started with AngularJS is very simple. Within a span of a week, a developer should be able to deliver some basic application.

You don’t have to master how scope and digest cycle works for doing the basic applications. With a basic idea of scope, binding model to the view, you can start writing the applications.

It one stop shop for all your needs. It provides a way to encapsulate your functionality into modules, reusable services, components etc.

Complete MVC (MV*) Framework

AngularJS is a complete framework, it’s not like jQuery or Backbone where you get a certain piece of functionalities and for getting the complete features you’ll have to add separate plugins.

AngularJS provides traditional MVC framework, the application can be layered

Data binding

You will fall in love with this features instantly. Data binding allows you to bind the model (data) to the view and vice-versa(two way binding).

With the example code given below, the updates to the input and bound to the label immediately.

Demo

Dependency Injection

We don’t have to worry about the dependencies to load, just declare them as dependencies and angular will take care of the rest.

It greatly makes the application readable, scalable and testable. While testing you can easily pass the dependencies.

Dependency Injection is a pattern which is mostly used in components to resolve their dependencies. Instead of direct instantiation, every component will receive references to required other components like services, utilities etc. as parameters to their constructor.

Custom Components – aka directives

Angular directives (components) extends the HTML, to add our customized behaviour.

It’s very easy to get started with basic custom directives, although you will need to understand how the internals work if you want to write complex directives.

Using the directives is pretty simple. Let’s say you want to include the lightbox or uiGrid directives, the sample code would be:

Simple Communication

AngularJS provides multiple ways to communicate between the components, controllers. The most recommended way is to use the services for sharing the data or the communication.

If we want http://thecraftofwriting.org/wp-json/oembed/1.0/embed?url=http://thecraftofwriting.org/2016/12/dont-feed-the-troll/ PubSub like model, angular provides two ways
1) $broadcast
2) $emit

$broadcast sends the messages to all the children’s (controllers)
$emit sends the messages to all the parents/ancestors

enter Pro Tip:
If you want to improve the performance, use $emit on $rootScope

Great Testing support – Unit and E2E

Believe me, AngularJS makes testing the application very simple. If you write the test cases for jQuery/Backbone, it would be neither straightforward nor simple and we have to use multiple libraries.

With Angular, testing the application is a piece of cake. Angular Provides two types of testing

1) Unit Testing

Using unit tests, we test individual pieces of code and make sure our code behaves the same in different scenarios. Angular provides the way to test Controllers, Services, Directives etc.
Angular Even provides mocking library so that we can easily mock the dependencies.

2) E2E Testing

Let’s look at the real-time use case, where we need E2E tests. Whenever some permission changes from the Database, the Unit test will not fail, whereas the DOM/E2E test will fail and make sure we don’t accidentally give the broken application to the client/user.

The actual DOM tests were made easy with watch protractor. Usually, these tests are written using Selenium, QTP or other tools.

Writing protractor tests is simple and we will have an extra layer of DOM testing which makes sure, the application is delivered in a properly working state.

It's only fair to share...Share on Facebook2Share on Google+0Tweet about this on TwitterShare on LinkedIn0

4 Comments

Leave a Reply

Your email address will not be published. Required fields are marked *