Introduction
In this article, I will explain what Angular is and how to set up an Angular Development Environment.
The following topics are covered in this article:
- What is Angular?
- Angular CLI (Command Line Interface)
- Setting up angular CLI
- Create an Angular APP
What is Angular?
Angular is open-source and is used to develop a modern web application. It is created and maintained by Google. Angular is totally rewritten as AngularJS, and the Angular name includes all versions of the Angular framework. The Angular versions are released from 2 up to 8. Now Angular's latest version is released, Angular 9.
Angular is based on TypeScript because Typescript is the core of Angular. TypeScript is an Open-Source Programming Language, developed by Microsoft. It is fully based on an Object-Oriented Programming (OOPS) Concept. TypeScript runs on any platform, and in any browser. The TypeScript is a superset of JavaScript.
Angular CLI (Command Line Interface)
Angular CLI is the tool for creating Angular apps. To perform all the tasks are taken by CLI. You don’t need to spend any time installing and configuring, as it will do everything automatically if you give it the command. Use CLI to install Angular CLI by following the below tutorial.
Setting Up Angular CLI
Step 1
Before installing Angular CLI we need to install Node.JS because Angular is using an NPM package. The latest version is 13.9.0. To download Node.JS, use this
link.
Step 2
After installation, open the Command Prompt, then enter the command “node -v.” It will show the node.js version.
Step 3
After installing the node.js open command prompt, install Angular CLI. Enter the following command to install automatically.
“npm install -g @angular/cli”
NPM denotes node package manager.
Step 4
We can install the packages if you see the version of Angular CLI. Enter the command to check the version “ng v or ng version”. Now, we can see that it is Angular CLI version 9.0.4
Create an Angular App
Let's create a new Angular application. To create a new Angular app, enter the following command.
Step 6
ng new <app-name>
“ng new myproject”
Step 7
Next, it will ask “Would you like to add Angular routing?”
Press “Y” If you want to use Angular routing, or press “N” if you don’t want to use Angular routing. Then press enter.
Step 8
Next, it will ask which stylesheet format you would like to use. Use the arrow key to choose the options and press enter. I chose CSS, as you can see in the below image.
It will take some time to create a new Angular app.
Step 9
Next, open my project using this command “ng serve --open”. It will be opened in the browser.
We have seen the output running in the browser:
Summary
In this article, we have seen an introduction to Angular and how to create an Angular app. I hope this article is useful to you. Thank you!