• Kushal Jayswal is a frontend developer from India. His expertise includes HTML5, CSS3, Sass, LESS, Responsive Web Design, JavaScript, jQuery, Twitter Bootstrap, Material Design, AngularJS, NodeJS, WordPress and Liferay Theming. He has founded TeckStack.com in 2011 to share his frontend knowledge with the community. His core interests focus on frontend, blogging, UI, UX and many others. He loves to talk on trending frontend technologies and successful blogging.

Do You Need AngularJS?

Angular

AngularJS is a JavaScript framework that helps developer to do powerful things at client-side without much hassle. You can really extend your own HTML with set of attributes. It supports awesome templating system built-in. The main purpose of AngularJS is to create Single Page Applications and that is with less coding efforts. It was first released in 2009 by Google developers and from that time, it has grown rapidly with high adoption ratio.

I would try to concentrate on the "WHY" factor of the AngularJS in this article. So let's start!

There are few basics you need to understand before trying your hands on the AngularJS.

Prerequisites

  1. HTML
    Basic knowledge of HTML tags would help you to understand templating in better way
  2. JavaScript
    AngularJS is a pure JavaScript framework, therefore you should have understanding of the basic JavaScript like functions, loops and best practices.

The NG- Prefix

If you have already used Angular then might you would aware about the ng- prefix and also site's FAQ page has mentioned the logic behind ng- prefix, but curiosity is the only reason for human survival, here is a good thread that explains various viewpoints on the same topic.

NoteI am not going to explain any of the AngularJS feature here. I would only discuss on the “WHY“ factor in this article. Although I have planned an article on Angular JS features, will publish soon!

The SPA

There are many JavaScript libraries like jQuery, MooTools and AlloyUI help to code client side with ready to use functions like click(), hover(), etc.. But AngularJS has a different purpose. We can consider it as a software framework. It can be used for front-end and back-end too. MEAN can help to understand what I mean to say. Meteor is also such a framework. But these would take us to the other direction. So let's focus on the Angular now.

The SPA, what is it? SPA means Single Page Application. For example, the Gmail application. In Gmail, once we login, we never see the page reloading on the mouse click. In simple term, we can say that Gmail fetches data from the server when user demands for it. So, your page is never going to be refreshed to see the output in browser window. AJAX is one of the popular and traditional technique for such a long time and still exist but now developer prefers BackboneAngular, Ember like frameworks which are more reliable and flexible.

The biggest challenge is to use AngularJS for a website or content based projects. Of course, it is possible but this is not advisable. Why? Because, content based projects intended to give some important information to its audience. The content is a key parameter for Search Engine Optimization.

That means fetching of data while you hit the URL in a browser. You will not be getting any data on a page by viewing the source code.

Sample Code

<div ng-view></div>
ng-view
ng-view

As you can see above, there is a single div tag, will be responsible to render data, run-time. You can open this demo in a new browser tab and try to see the source code and you won't find any content inside the ng-view. But the same code will render output in a browser window.

To simplify, we can consider ng-view as a data placeholder for rendering the data View.

The Crawling Solution

There is always a solution for everything. The same way Google has a meta tag through which you can tell the Google's search algorithm that my project is serving data with AJAX requests or is an SPA.

<meta name="fragment" content="!" />

But this is not the only thing. You need to deal with many more things which required lot of human efforts. Here is a good article talking about this.

I tried enough to make you understand on what the SPA is. But if you have more to speak, you can share in comment section below.

The Future

As you can see the trend for AngularJS keyword over the time (2005-2015), we can consider it for client projects and I am sure it won't disappear soon.

Google Trend (AngularJS)
Google Trend (AngularJS)

On the other hand people now moving to lightweight data-driven sites. Traditional data-driven site may have MySQL or Oracle database. But RESTful API is the future now. There are many frameworks like Angular and Backbone, without having heavy database configuration. So let's first understand the RESTful API.

The RESTful API

RESTful API stands for REpresentational State Transfer Application Program Interface. It gives various endpoints with set of data formatted with JSON or XML schema. Such data can be used for as a front-end output via HTTP mediator request. These requests can be any of the CRUD request. After innovation of the NodeJS now we do not need to depend on back-end languages like Java or PHP for full-fledged web application. But this is again a vast topic to discuss, so back to pavilion...

Interesting Reading:
How to Build Creative Portfolio with 500PX API

I saw many developers implement RESTful API for their project. If I would consider the WordPress CMS then it has awesome support for REST JSON API. You simply have to enable the plugin and you are good to play. I came to number of resources that speak about building themes with AngularJS and WP REST APIs. By following this way we are going to exclude the page reload and obviously we can see the performance improvement.

But I would suggest to go with a stand alone AngularJS application with combination of the RESTful API rather than to create a theme for a WordPress. Because though we have changed the theme to Angular, there are still some dependencies for which WP checks for extra queries in the background.

Likewise, we have other CMS like Liferay in Java, Drupal in PHP and so on. Also product based companies approaching to front-end developers to run with the trend.

Conclusion

This is such a discussion that never going to end. You may have different opinion than what I have. So at the end it's all up to the requirement and preferences. But the general observation says NO to AngularJS for informative sites and YES to product based projects or SaaS.