In this tutorial let us try to explore some basic concept about angular and then build a simple app using angular. According to wikipedia Angular is a Typescript based open source web application framework led by the angular team at Google and by several community of individuals and organisations. So, Angular is a javascript framework which has various advantages over javasript or jquery, because of the advanced functionality like Model-Binding, declarative templates, dependency injection, end to end tooling, making reusable components and so on.
First, of all let us have a look at the advantages of using angular:
1) Angular has two way data binding mechanism which reduces the developer time by reducing the extra work which would be necessary otherwise.
2) Angular is component based i.e the same components can be used over and over. which reduces the code repetition providing better spped in development.
3)Angular has Build in dependency injection which makes components more reusable, easier to manage and test.
4) Angular has great community and great documentaion so in case you fall into a problem you may easily escape from it.
However there are also some disadvantages of using angular like: the performance might not be good for all applications, similarly the learning curve of angular is more steep.
To start with angular you must first install node.js into your machine. you can download node using the following link. download. Or please follow the following link to view details about the installation process link. Now after making sure you have node js installed . Its time we install angular cli.To install angular CLI open your terminal/command window and type the following command.
npm install -g @angular/cli
So, after we installed angular cli it is time to create your workspace/ project. To create a workspace or initial project, open your terminal and write the following command.
ng new my-first-app
Now, wait for some time until the necessary files are downloaded through npm package manager; but before that you will need to provide information related to type of angular project you want to create as shown below. for now, let us use default routing and css as stylesheet. However you can make your choice on your own.
Press enter after specifying the type of project and after some time after the necessary files are downloaded, and our angular app is ready . Now, open your text editor and select the angular project you want to view. it might look something like below.
Now, to check whether our angular project was successfully installed or not, let us first serve it in the browser. To do so first of all from the menu, select terminal and then select new terminal to open the new terminal window in our text editor.
now, in the terminal window write the following command to start serving our angular app in the default browser and then press enter.
ng serve
Now, navigate to angular live server (localhost:4200 in our case) in the browser. there we can see the angular default template being displayed as shown below.
So, we successfully installed our angular project and served our default page into the browser. On Next tutorial we will learn about some basic commands that we need to create class, components, service etc. and using them. So, please stay tuned. Further, Please do comment what you think about this article in the comment section below.
