Series “Developing applications on single-Angular.js”

  1. Why do I need Angular.js and why he
  2. Modern tools and framework Angular.js frontend applications
  3. Familiarity with controllers and directives Angular.js
  4. Writing Services in Angular.js
  5. Routing in Angular.js
  6. How to connect to the API backend Angular.js

Why do I need Angular.js and why he

At some point, you decide to write a web application in which everything runs on AJAX call, the page never reloads, and the interface resembles a full-fledged desktop application rather than a traditional website. You try to do everything with a simple JavaScript and jQuery plugins couple of dozen, and quickly written code will be impossible to maintain, it is impossible to read and impossible to govern.

To avoid such a catastrophic situation, you need a tool that provides a rigid structure of the code and agreement on writing applications, as well as turnkey solutions for known issues (for example, for two-way communication variable in the code and text on the page that displays the value of this variable). This tool – JavaScript MVC (MVC or analogs) frameworks.

There is a high probability that you will not need to use the JS frameworks coming months and \ or years. The area of application is quite specific: the so-called one-page application (Single Page Applications, SPA). Typical examples: Google Drive, Gmail, Evernote. But even in those cases when the task is to write a one-page application that does not always make sense to use a full-fledged JavaScript framework: it all depends on how dynamic and complex UI you are trying to build.

Web version of Evernote – SPA typical application

angular-post-1-img-1

Nevertheless, the popularity of such tools has never been greater, and at least be aware of their existence is. Tell all available varintah at a time is not possible, so in this series of articles we will look at a framework Angular.js. If you are interested in alternative solutions, you can watch them online http://todomvc.com/ – the authors of the draft implementing the same application on different frameworks, to make it easier for developers to choose the most suitable for them.

Why Angular.js?

From my point of view, Angular.js became a stunning combination of a low entry threshold and a rich set of functions. To start writing on it a small application, you will need about an hour of free time. In this case the fact to learn and to use all its features, will need months. While there was not a single front end problems I could not solve with the help of this framework. And I used it for cross-platform mobile applications with rich functionality, small widgets within applications and even video editor.

Angular.js at the moment is the most popular framework, whose development is supported by the guys from Google. In addition to the rich standard library, for “angulyara” written many custom extensions, with a part of which we will introduce within this series. There is even a special framework over Angular.js, which greatly facilitates writing cross-platform mobile applications: http://ionicframework.com

angular-post-1-img-2

What about Angular.js 2.0?

The current version Angular.js, where this series of articles will be based – 1.3. The developers have stated that the version 2.0, which will be released when it is not known (but no earlier than year and a half), is incompatible with the current version of the framework, but it will retain most of the concepts embodied in it. Also, the developers promise to support the version 1.x for several years after the release of 2.0.

This means that at least another 2 years Angular.js 1.x will continue to dominate on it is still written thousands of applications and a variety of jobs (especially in Europe) indicate precisely the frameworks in the requirements. Of course, at some point you will have to spend a couple of hours trying to deal with the new version 2.0 and, most likely, a couple of days to switch from 1.x to 2.0. Nevertheless, Angular.js knowledge will not be thrown in the trash, because, as you already know, this issue is not a specific technology, and the ability to understand any of them, and apply for its task 😉

The announcement of version 2.0 can be read here: http://angularjs.blogspot.se/2014/10/ng-europe-angular-13-and-beyond.html. More good article with more technical details: http://ng-learn.org/2014/03/AngularJS-2-Status-Preview/

So what are we going to do?

In this series of articles we will write a small finance manager: start with the work environment configuration and structure of the project and will finish the work with the API. On the way to get acquainted with the basic concepts Angular.js, routing, some third-party libraries, and a few essential tools of modern front-end development. At the end of the series, you should be able to write a simple application to Angular.js and know where to look in order to learn how to develop more complicated things.

Yaroslav Golovach
y