How to Install and Set Up Angular 9 on Windows 10

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

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

  • Ivy – This is the next-generation compilation and rendering pipeline introduced by Angular with this release.
  • Smaller bundle sizes- Small apps and large apps can see the most dramatic size savings in Angular 9.
  • Faster testing- implemented an improved version of TestBed in Ivy to make it more efficient.
  • Better debugging- Ivy provides you with more tools to debug the application.
  • Improved CSS class and style binding – Handling styles is now easier with Ivy compiler and runtime.
  • Better type checking- Now Angular compiler can apply strict rules when coding an app which reduces the bugs in a team project.
  • All the error messages are now easier to read.
  • Improved build-time – Now building a project is faster compared to the previous version.
  • Internationalization – You can build the application once per locale and receive highly optimized and localized applications.

Install Angular 9 on Windows 10

If you are a visual learner, please follow steps in the following video.

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

1. Install Node.js

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

To install Node.js, go to the official Node.js website, download the latest version and install it.

After the installation, check the versions using the below commands.

node -v
npm -v

This will show the installed versions of Node.js and NPM.

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

2. Install Angular CLI

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

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 ask you 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.

3. 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 ask you 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 chose CSS.

4. Running Our App

Now, the app you created can be run using 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 address http://localhost:4200.

TechoTip: 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 9 using NPM(Node Package Manager).

2 thoughts on “How to Install and Set Up Angular 9 on Windows 10

  1. once when i install node js and check in command prompt only the version of node js is coming but when i check for npm i am getting as uncaught reference error.
    So what can be done?

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.