Introduction of Angular2

What is Angular 2?

Angular 2 is a framework for creating single page Applications (Spa). Angular2 is made up of a component and directives. The reusability of the component made Angular2 more popular. Component is basically made up of the template, metadata, and class. The second key difference between Angular 1 and Angular 2 is that Angular 2 is written in typescript, so it makes Angular2 strictly a typing language. By default, it doesn’t support the two way binding of the data so it makes it faster than the previous version of Angular. The third advantage is after doing changes, just save the page,  and the Browser updates the changes automatically. Isn’t it cool? There is a lot to talk about  regarding the changes in Angular2 and Angular1, but here I am showing you, how to start with Angular2, using the command line interface and how to start writing your first Application. For more comparison between Angular2 and Angular, you can simply visit this URL.

Steps for getting started with Angular2 Command Line Interface(CLI),

Step 1: Install nodejs from https://nodejs.org/en/,



After installing nodejs, open the command prompt on your machine,  or if you're a Mac user open the terminal. We require nodejs for hosting Angular to the Application locally.

Step 2: Installing Angular-CLI to your machine, use –g to use it globally on your machine

Windows user

npm install –g angular-cli

Mac User

Sudo npm install –g angular-cli

Note: -g stands for global



Step 3: Now, createa new Angular Application. In your command prompt,  navigate to the directory in which you want to create the Application. Write the following code and click enter:

ng new myfirst-app


Step 4: Now, to host your Application in the local host, we need to host the Application you just created. For it, run the following command:

ng serve,



Good to go. Your first Application is now created and is ready for use. Now, simply go to your Browser and paste the url, given below:

 
http://localhost:4200/



Now, the Browser will get Angular2 directives and your first page will be loaded as following:



In summary, this is my first experience  writing something and publishing to the Web. If there are any mistakes regarding typos and content, please excuse me.

This brings us to the end of the first demo of getting started with Angular2 in a few easy steps. I hope it will be helpful to you and also you can give your feedback and stay tuned for more updates for Angular2 demos. Here, I am starting the new series of Angular2 demos. The next article will show you how to bind the data with Angular directives, events, routing, directives and so on. Stay tuned for more updates and yes let’s do  Angular2, my way. It will give me more energy and  aboost if I get some feedback from the readers. Thus, please give the feedback..cheers!!!!