In this article, we will install Angular CLI using npm and create and run a Hello World app.
1. Installing Angular CLI
For installing angular, first make sure you have node and npm installed and then run the following from command prompt.
npm install -g @angular/cli
This should install latest angular version. You should see the version in command prompt.
2. How to check the angular version installed
You can use any of the below commands to check the version :
ng version
ng --version
ng v
3. Create a workspace and initial application
For creating an application in angular, the command is :
ng new appname
Once, the app is created, you can go the corresponding folder and start the server.
cd appname
ng serve --open
This should open the default angular app with url localhost:4200
4. Hello World
We can customize the default app for hello world with following changes.
src/app/app.component.ts
import { Component } from '@angular/core'; @Component({ selector: 'app-root', templateUrl: './app.component.html', styleUrls: ['./app.component.css'] }) export class AppComponent { message = 'Hello World'; }
We added a property called message in the AppComponent.ts
src/app/app.component.html
<div style="text-align:center"> <h1> {{message}} </h1> </div>
Start the server using :
ng serve --open
It should start the server and load a browser with url localhost:4200.
It should show Hello World on the browser at this point.
© 2019, https:. All rights reserved. On republishing this post, you must provide link to original post