Getting started with Angular 2 tutorial series - Part 1
This tutorial is the first one from a series of tutorials about getting started with Angular 2 framework .In this first tutorial we are going to introduce the framework to developers who don't know it yet .So lets get started .
What is Angular 2
On September 14 ,2016 The Google team announced the final release of Angular 2 as a successor to Angular 1.x ,so the API is now stable and there will be no breaking features for the API .As a developer this means that you can start using Angular 2 for building production ready applications for the platform of your choice .
Why using Angular 2 ?
In our days ,there are many great frameworks ,either free and oepn source frameworks or proprietary and paid frameworks .One of the most asked questions by developers is why I should use the framework x instead of the framework y ? we are not going to talk about why we need to use a framework because that's another subject .But just why Angular 2 over other available frameworks .
First of all ,Angular 2 targets the already existing community around its first version Angular 1,which is huge .So if you are already an Angular 1 developer and you are fascinated by the great features of Angular 1 then you should be more than fascinated by Angular 2 since it's a better version with increased performance ,stability and modernity .Angular 2 uses a modern compoenent based software architecture that makes you more productive and makes building complex and large applications painless .You might find problems making the transition or migrations your apps from Angular 1 to Angular 2 depending on your trade-offs but the Google team is already doing a great job to ease the transition or migration by adding modern Angular 2 features in Angular 1 starting with version 1.5 .
For developers using other frameworks other than Angular or about to decide which framework to choose .We are not going to enter a debate of the like ,Angular 2 versus another framework ,say for example React by FaceBook ,Ember.js or Backbone etc .There are already many articles comparing these frameworks versus the others on the web But it should be enough to know about these points .
- Angular 1/2 has a huge community around it
- It's built and backed by the giant Google which has already many great products
- Companies around the world are embracing it quickly
- It's modern and uses advanced software architecture patterns
- Targets all platforms ,the Web ,Desktop and Mobile
- Makes building complex applications easier
- It's the most popular open source and free framework etc.
- Using TypeScript means better development ecosystem and tools ,better IDEs integration with features such as auto completion and type suggestions
- Angular 2 is easier than Angular.js
- Angular 2 use modern tools such as the ES6+ module system
- Angular 2 use modern tool-chain such as Webpack or SystemJS
Angular.js already helped developers and teams build large scale applications accumulating an experience and community feedback of more than Five years of what is should be added ,changed or removed so Angular 2 takes all that into consideration to build a better and modern framework with the best features of Angular 1 plus other modern features used by modern frameworks or libraries such as React .You know what I mean Components .
Angular 2 has also many other features such as a modern routing ,templating system ,Shadow DOM ,Annotations and Observables etc.
Angular 2 versus Angular 1 or Angular.js 1.x
Angular 2 is the next version of Angular 1 which is totally built from scratch which means they have many differences and similarities .
Angular uses a bunch of directives ,controllers ,services and factories together to build the app .Angular 2 focus mainly on the concept of components .You apps is basically a parent root component which has child components .
Angular.js 1.x makes heavy use of $scope and $watch (bad for performance) both are not available on Angular 2 .
Angular 2 replaces the directive concept of Angular 1 with components which a more powerful and modern concept .But you can also use directives in Angular 2 and also components in Angular 1 started with version 1.5 and even patched in Angular 1.3 by the community.
Angular 2 uses OOP ,ES6 and TypeScript, classes .Angular 1 is focused around functions to create everything from modules, directives ,filters ,controllers ,services and factories .
Angular 2 uses the modular system of ES6+ but Angular 1 uses its own modular system .
Angular 2 has a modern and powerful router for implementing navigations between different components .Angular 1 used many implementations for routing .The latest one is the ui-router which uses the concept of states for navigation .
Angular 2 is independent of browser DOM .Angular 1 can not be used without the browser DOM .
So that was the first tutorial in a series of tutorials to get started with Angular 2 . We have tried answer many developers questions such as what is Angular 2 ? and why you should use Angular ? So i hope this post answered your questions or encouraged to try Angular 2 .The second tutorial is about using the Angular 2 CLI (Command line interface) tool to quickly bootstrap and generate your first Angular 2 project and to assist you in the scaffolding of different Angular 2 constructs such as components,pipes and services etc.
Note: We also publish our tutorials on Medium and DEV.to. If you prefer reading in these platforms, you can follow us there to get our newest articles.
You can reach the author via Twitter:Follow @ahmedbouchefra
About the author
Get our Learn Angular 8 in 15 Easy Steps ebook in pdf, epub and mobi formats, plus a new Angular 8 tutorial every 3 days.
Angular 9/8 Topics
Read our other tutorials
- Angular Tutorial
- Laravel 6 Tutorial
- React Tutorial
- React Hooks Tutorial
- React Native Tutorial
- Webpack Tutorial
- PHP Tutorial
- Django Tutorial
- Java Spring Tutorial
- Rails 6 Tutorial
- Ionic 4 Tutorial
- TypeScript Tutorial
- Bootstrap 4 Tutorial
- Electron Tutorial
- Cordova Tutorial
- HTML Tutorial
- GraphQL Tutorial
- CSS Grid Layout Tutorial
- PWA Tutorial