Introduction

Angular JS2 is a modern framework for app development. It is essentially a structure that helps you create applications faster by providing a number of service and objects that makes things easier for app developers.

The Angular JS2 is a dramatic upgrade to the previous version of the framework. It is really a rethinking of how applications should be built.

One of the primary reasons for a lot of these changes is performance. So Angular JS2 apps run 3-5 times faster than the previous version.

TL;DR

• Framework for app development;
• Dramatic upgrade from Angular JS1;
• Much faster performance;

What's different?

How is Angular JS2 different than the original version?

Firstly, in the new version of Angular JS, everything revolves around something called component. Components are like Angular JS1's custom directives. They let you create functionality around custom tags. So, instead of adding an ngApp directive to a section of code, you simply invert your own tags and then program the functionality for these tags yourself. It is a lot like using web components and it is one of the best new features of the framework. The components are also much simple than Angular JS1's custom directives.

Secondly, since most of the work is handled by components, there's really no need for controllers in Angular JS2.

Thirdly, one of the big adjustments you will have to make is that there is no more scope in Angular JS2, the templating system is also richer, which also means more powerful, but more complex.

TL;DR

1. Focus on components;
2. No more controllers;
3. No more scope;

Programming AngularJS

Now you can program Angular JS in a variety of different languages. This is one of the ways that Angular JS2 is significantly different since you can choose one of these three languages:

• ES5 - this is what we called regular JavaScript, also known as ECMAScript 5.
• Dart - a open source language from Google.
• TypeScript - a open source language from Microsoft. It is a superset of JavaScript, which allow you to use any ES6's features and it also adds a few important features of its own.

Advantage of using TypeScript

Angular JS2 was actually built with TypeScript, so there is a significant advantage to learning how to work with TypeScript. In addition, mainly that most of the documentation that you'll find for Angular JS2 will be written in TypeScript too.

You can use any of ES6's features, you have the access to classes. If you're coming to Angular JS2 from regular JavaScript, then you'll need to get used to working with classes. They allow you to create a more object oriented approach to JavaScript. In TypeScript, classes are really well organized and defined so you'll actually end up liking the way that you work with them in Angular JS2.

ES6 also has a rich templating system that is extensively used in Angular JS2 and it makes creating templates a lot easier and much more fun than in Angular JS1. TypeScript also adds 2 important features to Angular JS2.

• The first is types which allows you to define the types of variable that you're using. Now this is optional, but it's something that can help with debugging so it's going to be a good idea.
• Another awesome feature of TypeScript is something called annotations. Annotations are a way to add metadata to your code. Now this is extensively used in Angular JS2 to help you extend the components and handle a lot of how you set them up. Now this is one of the features of Angular JS that are really a lot of fun. Now because TypeScript and ES6 are not supported in current browsers, you'll need to use something to convert this code to regular JavaScript. That means that you'll need to use a build tool like Webpack or GulpJS to handle the conversion.

TL;DR

• ES6: classes;
• ES6: templates;
• TypeScript: types;
• TypeScript: annotations;

References & Resources

• N/A