In this tutorial you will learn about angular 6, environment setup, basic concepts, basic difference between angular 1 and above (angular 2+) etc. Let's learn it step by step.
Angular is a javascript framework which is used to build single page web application using HTML,CSS, Javascript and TypeScript language. Typescript is the superset of Javascript. Angular is the name of Angular version 2+. In last one decade we have seen a tremendeous change in Angular versions from Angular JS version 1.X to Angular version 2 to 6. In below section you can see Angular versions.
Angular started with Angular JS version 1.X in year 2010. Journey started from Angular JS 1.1 in year 2010 to Angular JS version 1.7.2 stable version launched in year June 2018. It came up with n number of concepts like SPA (Single Page Application)and MVC architecture with some powerful features like routing, one-way and two-way bindings, inbuild directives, services, validations and filters which made developer's life easier and application faster and interactive. But if at one side it has so many pros, on the other hand there were few cons also like unnecessary watches used to slower down application performance.
From year 2015 Angular JS totally changed and a new version came into existance which was Angular started from version 2 in year 2015. Angular version 2+ is popularly knowns as Angular and version 1.X is known as Angular JS. Major difference between 1.x and 2+ is architecture i.e Angular 1.x uses MVC architecture where as Angular 2+ uses service/controller. After Angular 2, many more versions came into picture like Angular 4 in 2017 and Angular 5 and Angular 6 which was introduced in late 2017 and early 2018. Angular was facilitated by new language known as TypeScript.
As we discussed above, Angular 1.x came into existance in year 2010 with major features as scope, bootstrap, two-way and one-way binding, MVC (model-controller-view) architecture, routing, filters, directives, services with features as $digest(), $apply(), $watch(), ng-* and etc. Here are the versions and year of release.
An example of creating component in Angular 1.5
myModule.component('myComponent', { template: '<h1>Hello </h1>', bindings: { firstName: '<', lastName: '<' }, controller: function() { this.getFullName = function() { return this.firstName + ' ' + this.lastName; }; } }); <my-component first-name="'Alan'" last-name="'Rickman'"></my-component>You would know this that till the time when Angular 1.3x came into picture in year 2013, development of Angular 2 was already started with Typescript and EC6 (Ecma 6) and in December 2015 beta version of Angular 2 came into picture. You can read these old links of angular blogs from blog.angularajs.org. Till now we have four major stable versions with sub versions like 2x, 4x, 5x, 6x and version 7 and 8 are expected soon. Below are the list of stable versions. Month may vary a little but the years are correct. Let's see.
Angular 2+ is totally different from Angular 1.x in architecture design, rendering, language, UI and many more. Below we will see few difference between two.
Angular 1.x follow MVC architecture. Angular 2+ uses service/controller design.
Angular 1.x uses javascript as language whereas Angular 2+ uses typescript which is totally different than Javascript. TypeScript is a superset of JavaScript which helps to build more robust and structured code.
Angular 1.x uses model-controller-view concept to build application and UI whereas from Anuglar 2+ Component based UI came into trend. This helps a developer to divide the applications into components with desired features and enable to call required UI. These have helped to improve the flexibility and reusability as compared to Angular 1.x.
Angular 2.x is more in mobile support than 1.x.
Angular 2.x has reduced the bundle size of build as compared to Angular1.x.
In next chapters we will see how to build angular application and will also see new concepts and features used in Angular 2+.
