How to Install Angular [Windows, Linux, Mac]

How to Install Angular is the topic of this tutorial. If you already know about Angular 2, Angular 4 or Angular 5, It will be pretty much same to start a new brand project in Angular.

However, If you don’t have previous experience with Angular, then don’t worry — It would be really easy for you to Install Angular on your machine. But, before going further let’s know what is Angular and what one should know before installing and learning the Angular.

What is Angular??

Angular is a modern frontend Javascript frameworks that make it easy to build applications with the web. Angular gives power to developers so that they can build applications that live on the desktop, web, and mobile.

Prerequisites while Install Angular

To Install Angular on your computer you should have the following given below:-

• Node.js
• Node Packange Manager (NPM)
• Basic Knowledge to run command via terminal

To check whether or not you have top two of these installed, open your system terminal and type:

node -v or node --version
 npm -v or npm --version

If these commands do not recognize by your system and gives you a message that proves it is not installed on your system.

Then, If you have not installed Node.js and NPM on your computer, Please follow the simple Node.js installation process that will take few minutes to make your system Node enabled.

After a successful Node.js installation you will get the below screen when you run the command again given above:-

Install Angular using the CLI (Command Line Interface)

Angular CLI (Command Line Interface) is really a quickest and very simple and easy way to get started with a new Angular project.

We have now NPM installed on our system So We’re going to use NPM to Install the Angular CLI through the command, Just open the terminal and run the command given below:-

npm install @angular/cli -g

It will take little time to install Angular CLI in your computer globally. After a successful installation run the command to check the version of CLI

ng -v

You can see the screenshot above that gives me Angular CLI version 6.1.4, which is really great. Now run the few commands to create a brand new Angular project.

Go to your system directory where you want to create the project, For me, I have created a folder MyApps on Desktop. You can choose your’s own folder name.

cd ~/Desktop/MyApps

Now we are in MyApps directory, Now run the command to create or Install Angular project in the current directory.

ng new my-new-angular6-project --style=scss --routing

We have added two flags in the above command –style=scss and –routing, You can ignore these and can run the command simply ng new my-new-angular6-project.

• –style=scss – It tells the CLI that we want the CSS to use the Sass compiler.
• –routing – It tells the CLI that we want the routing environment pre-setup in the project. But I’ll suggest you to not use this flag if you are a beginner and try to create routing manually in the project that will help you to understand Angular Routing and Angular Menu Navigation.

After a successful installation you have your brand new Angular project ready to run, To test this just navigate to your project directory and run the command.

cd ~/Desktop/MyApps/my-new-angular6-project
 ng serve

It will take a few seconds to compile the project, After a successful compilation open the browser (I prefer Google Chrome) and run http://localhost:4200.  You will see running angular Project.

Install Angular without the CLI (Command Line Interface)

It’s a really simple process to Install Angular without the CLI. Just go to the Angular Quickstart page and download the zip folder which contains the basic structure of an Angular Project.

Once the Project folder downloaded extract it and move the extracted folder into your Project folder where all your project lives (As I said above mine is MyApps folder under Desktop).

Navigate to that folder and simply run the command

npm install

It will download all the necessary Node Modules and dependency which is needed to run an Angular Project. After then you can run ng serve command to compile the Project as you normally do.

So, What is next??
In the next tutorial, We will learn about Angular Files & Folders Structure.  For now, Please share your thoughts in the comment section and let me know what you want to learn in the upcoming days.