Angular 4 Setup Guide for Development Environment!

Angular 4 Setup Guide  -

Step 1. Setup the Development Environment

1.     Install Node.js and NPM  -If you are not already have on your machine!

2.     Then you Install the Angular CLI globally!

npm install -g @angular/cli

Step 2 - Navigate to project directory and Create a new project!

$ cd ~/Dev/
$ mkdir appDir && cd appDir 
$ ng new my-app

Note - ng new takes time to run!

Step 3 - Navigate to project & Run Local Server!

$ cd /path/to/your/newly/created/app/

like

$ cd ~/Dev/appDir/my-app/
$ ng serve

Open local host - http://localhost:53865/

Note –The ng serve command is used to launches the server, watches your files and rebuilds the app as you make changes to those files!

Step 4 -Edit Project and Save files

 - Open file in appDir/my-app/src/app/app.component.ts, EDIT and SAVE

import { Component } from '@angular/core';

 @Component({
   selector: 'app-root',
   templateUrl: './app.component.html',
   styleUrls: ['./app.component.css']
 })
 export class AppComponent {
   title = 'Welcome you in Angular 4!';
 }

Step 5. Test build

ng build

Reference - https://angular.io/guide/quickstart

I hope you are enjoying with this post! Please share with you friends! Thank you!!!