How to Install Angular

In this tutorial, you can learn how to install Angular. We use the Angular CLI to install Angular, which hides the complexities of installing Angular. But before installing Angular, we must install NodeJs, NPM Package manager, and Visual Studio Code.

How to Install Angular

To install Angular, you will need to install the following.

  1. Install Visual Studio Code.
  2. Install Node.js and npm (Node Package Manager)
  3. Install the Angular CLI

Installing Visual Studio Code

When it comes to choosing an IDE to develop Angular applications, we have a lot of choices. You can select Angular IDEWebstormSublime Text, etc.

We will be using Visual Studio Code as our editor. Visual Studio Code is an open-source project and free to use. It can run on Windows, Linux, and OS X. It has IntelliSense support, easy integration with Git, and support for debugging applications. Visual Studio code also has excellent support for Typescript.

You can download Visual Studio Code from the following link. The installation procedure is an easy task and a straightforward process.

Installing NodeJs & NPM Package Manager

Why NodeJs is Required

You must install NodeJs and the NPM package manager to develop an Angular application. Note that both of them are not required on the production server.

Angular uses Node.js for its build and development tools. For example, the angular compiler needs to transpile the TypeScript code into JavaScript. It also needs to perform steps like minification, bundling, and build optimization of the final code. To run all these tools, it needs Node.js.

NodeJs also spins up a lightweight web server. Angular uses it to host the application during development. 

NPM Package Manager (NPM)

Angular uses the Node Package Manager to install and manage all of its dependencies. NPM Package manager comes bundled with the NodeJs

We will use NPM to install Angular, TypeScript, and any other packages/modules our application requires. NPM can be used to upgrade these packages as and when necessary. Without NPM, we have to download and install all these packages manually.

Installing NodeJs

You can download NodeJS and install it. NPM is installed as part of NodeJS. Click on the installing node for the instructions and procedures.

Installing Typescript

Angular requires Typescript. But you do not need to install it separately. It will be taken care of when you install Angular.

Installing Angular

We install Angular using the Angular Command Line Interface (Angular CLI)

The Angular CLI helps us to quickly create an Angular application with all the configuration files and packages in one single command. It also helps us to add features (componentsdirectivesservices, etc) to existing Angular applications.

The Angular CLI creates the Angular Application and uses TypescriptWebpack ( for Module bundling), Karma ( for unit testing), Protractor ( for an end to end testing).

Installing Angular CLI

We use the npm command to install the Angular

The above command installs the latest version of Angular CLI in your machine. Note that we have used the -g flag, (which stands for global) installs the Angular CLI system-wide so that you can use it in your all projects.

In Windows machines the npm requires rights to run the PowerShell scripts. By default it may be disabled in windows client. You may need to enable it, if you want to install Angular CLI via npm. You can enable the rights by running the following script

Set-ExecutionPolicy -Scope CurrentUser -ExecutionPolicy RemoteSigned

Read the message and follow the directions. Also, be sure you understand the implications of setting up an execution policy.

You can also install the older version of Angular as shown below

Finding the Angular CLI Version

You can find out the Currently Installed Angular CLI Version by Using the Command

The latest version of writing this article is 11.1.0. The command above also gives the version of the node installed in your system. You can keep track of the latest Angular CLI release from this link

The Angular CLI also installs the Typescript and all its dependencies.

With the installation of Angular CLI, you are ready to create your first Angular Application.

Create a new application

To create a new application, run the following command

This will create a new workspace and a project called helloworld. To run the new application run the following command

Open the browser and go to http://localhost:4200/

Installing Angular

Summary

To install Angular, you need to install the following

  1. Install Visual Studio Code.
  2. Install Node.js and npm (Node Package Manager)
  3. Install the Angular CLI using the command npm i -g @angular/cli@latest

References

Leave a Comment

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.

Scroll to Top