Introduction
Angular is a platform and front-end framework for building single-page client applications using HTML and Typescript. It uses Typescript by default for creating logic and methods for a class. However, the browser doesn't know the typescript here, as Webpack comes in the picture. Webpack is used to compile these typescript files to javascript. For this type of configuration, files are required in the Angular project.
Angular CLI is a tool that does all these things for a project with some simple commands.
Prerequisites for Angular Project
- Node 4.x.x or higher
- Npm 3.x.x or higher
If you have already installed the above software, verify that you are running at least node 4.x.x and 3.x.x or higher by running node -v and npm -v (check the versions) in a terminal/ console window.
Setting up an Angular Project
Install Angular CLI
Install Angular CLI by running the "npm install - g @angular/cli" command in the console window.
Create a new project
Create a new angular application by this command "ng new appname", choose yes for Angular routing option and select the styles like CSS or SCSS. Once executed, Angular CLI will create an Angular project with some default node module packages.
Select routing option
Select styles option
After selecting routing and styles, Angular CLI will install required node modules packages for the angular project.
Go to Project directory by using "cd myapp"
To build and execute the project by using "ng serve" command
After successfully building the Angular project
Open your browser and enter "http://localhost:4200/" OR by using "ng serve --open " command to directly display UI in your browser.
Summary
The above blog showed how to create an angular project using CLI commands.