Angular 2 Tutorial

Angular 2 is an open-source JavaScript library maintained by Google, used to assist in running single-page applications.

Angular 2 is an upgraded version of Angular 1.x, with significantly improved performance and good support for web development components.

Angular 2 was released in September 2016, and it is developed based on ES6.

Prerequisites for learning this tutorial

Before learning this tutorial, you need to have basic front-end fundamentals: HTML, CSS, JavaScript. In addition, you need to understand NPM and TypeScript.

Differences between Angular 2.x and Angular 1.x

The difference between Angular 2.x and Angular 1.x is similar to the difference between Java and JavaScript, or to put it another way, the difference between Lei Feng and Leifeng Tower, so when learning Angular 2.x, everyone needs to be mentally prepared to relearn a language.

Runtime Requirements!

Since various environments (browsers or Node) currently do not yet support ES6 code, some shims and polyfills (needed for IE) are required to convert ES6-written code into ES5 form so that it can run normally in browsers.

As can be seen from the figure above, the following module loaders are needed under ES5 browsers:

  • systemjs- A general-purpose module loader that supports loading JS modules in various formats such as AMD, CommonJS, and ES6.

  • es6-module-loader- ES6 module loader, systemjs will automatically load this module.

  • traceur- ES6 transpiler, which converts ES6 code into ES5 code supported by the current browser. systemjs will automatically load this module.

Related Reference Documentation

Other extensions