#4. How to setup development environment for Angular 10

Read time : 8-10 minutes

Step-1 : Download Node.js (why to use Node.js for angular development.)

Download Node.js here

Why should you use Node.js for angular development

Angular development is operational with Note.js and even without the use of Note.js. You can develop angular application without Node.js as well. Here, i am explaining why making the use of Note.js is a better decision in comparison to not using it:

1. Node allows you to spin up a lightweight web server to host your application locally in your system.
2. NPM (Node Package Manager) happen to arrive with Node.js by default. NPM enables you to deal with your dependencies. This removes your burden to carry out operations like adding a dependency, removing some, updating your package.json.
3. The most important aspect of using Node.js is that, npm gives you angular cli or ng cli(angular command line interface) . Angular CLI is a great tool for supporting your application. So, it is not required to write boilerplates manually.
4. Angular recommends to make the use of TypeScript. The problem which arrives next is that your browser does not understand TypeScript. It needs to be converted to JavaScript. Also, you need to bundle your js files and stylesheets together with the html doc in order to get the web app CLI which is ready to be hosted. Angular CLI helps you to do all these hassle behind the scene without having to manually operate. By default, ng cli uses webpack for bundling your application. It is very convenient for beginners who have just stepped into web development with angular as it takes care of such complexities.

Step-2 : Install Angular CLI

1. Open command prompt.
2. Run the following command in order to install Angular CLI. This command will install the latest Angular CLI.

npm install - g @angular/cli

Step-3 : Creating a new project in Angular 10.

    To create a new angular 10 project , Go to any directory (Where you want to create Angular project)     and run the following command.

ng new projectname

Step-4 : Run you Angular project.

    1. Change directory and go to newly created angular project directory by following command.

cd projectname

    2.Run you app by following command.

ng serve

    3. Finally open your browser and see you result on url :  http://localhost:4200/

NOTE : Angular default port is 4200. If you want to deploy your app on different port then run the following command .

ng serve --port 3000

Now you can see your result on http://localhost:3000/

---

For more updates please follow us on :

Twitter      : https://www.twitter.com/dorado2041
Facebook  : https://www.facebook.com/dorado2041
Instagram : https://www.instagram.com/dorado2041
Blogger      : https://doradosolutions.blogspot.com