How to Install and Set Up Angular 11 on Windows 10

On February 7th, 2020, a new version of Angular is released which is Angular 11. A lot of new features and performance improvements are introduced with this release. Here in this article, we will discuss some features in Angular 11 and the steps to install Angular 11 on Windows 10.

I am not entering the explanation of new features in Angular 11 but listed out some of them below.

• Faster Builds.
• Angular ESLint Updates.
• Internet Explorer Updates.
• Webpack 5 Support.
• Improved Logging and Reporting.
• Updated Language Service Preview.
• Updated Hot Module Replacement (HMR) Support.
• Automatic Font Inlining.
• Component Test Harnesses

Install Angular 11 on Windows 10

If you are a visual learner, please follow the steps in the video I added below.

For others, please follow the below steps to install Angular 11 on Windows 10.

Prerequisites

To continue with this article, the reader must know the basics of working with the Command Prompt/ Powershell in a Windows 10 system.

What we will learn?

Here in this article, we will learn the following things:-

• Install Node.js on a Windows 10 system
• Installing the Angular CLI
• Creating a new Angular application
• Running the Angular app we created

Install Nodejs

We need NPM to install Angular CLI. To install Node.js on your system and NPM will install with Node.js.

This can download and install from the official website. Currently, 16.13.0 is the stable version of Nodejs and it can download and install on our system using the URL below.

 https://nodejs.org/en/download/current/ 

From the page, select the Windows installer option and download the Node.js installer file. Then install it on our system

After the installation, check the versions using the below commands. This will confirm that the Node.js and NPM are installed on our system successfully.

So open Command Prompt/ Powershell in our Windows system and execute the below commands

node -v
npm -v

If you are really a beginner in this field, the guide Steps to install Node.js and NPM on Windows 10 will help you.

Install Angular CLI

Angular CLI helps us to create projects, generate application and library code. Also, we can perform a variety of ongoing development tasks such as testing, bundling, and deployment using it.

It can simply be installed using NPM. So first, open our Command Prompt / Powershell and install the Angular CLI with the below command.

npm install -g @angular/cli

This will prompt us a question.

Would you like to share anonymous usage data with the Angular Team at Google under Google’s Privacy Policy at https://policies.google.com/privacy? For more details and how to change this setting, see http://angular.io/analytics.

You can either agree or disagree with the question. Press y and Enter for agreeing and n and Enter if you are disagreeing. This answer won’t affect the Angular installation.

Creating a New Angular Application

You have successfully installed Angular CLI on our system and now you can set up a workspace for Angular projects in the system and create a new app. This can be done with the below command.

ng new awesome-project

This will prompt us with two questions.

1. Would you like to add Angular routing?

press y if you are preferring t to create a multi-page website. Otherwise choose n.

2. Which stylesheet format would you like to use?

Choose any stylesheet format that you are familiar with. Here I am choosing CSS.

Running Our Angular App

Now, the app you created can be run using the ng serve command.

cd awesome-project
ng serve --open

This launches the server, watches our files, and rebuilds the app as we make changes to those files. The –-open (or just -o) option automatically opens our browser to the below address.

http://localhost:4200.

We recommend using Visual Studio code as the source-code editor for working with Angular projects.

Summary

So, we have discussed the steps to install Node.js on our Windows 10 system and installation on Angular 11 using NPM(Node Package Manager).