The Angular CLI is a command line interface tool that can create a project, add files, and perform a variety of ongoing development tasks such as testing, bundling, and deployment.

Now, let us start with developing our first angular application.

Note: It would be best practice if you create your own development environment to develop any angular application.

Create your own development environment:

Before starting with our new angular application development, make sure that you have installed Node.js® and npm on your machine. Also, verify that you are running at least node 6.9.x and npm 3.x.x by running node -v and npm -v in a terminal/console window. Older versions produce errors, but newer versions are fine.

Run below command in a terminal/console window to install Angular CLI globally on your machine.

npm install -g @angular/cli

Create your first angular application:

We are done with creating our own development environment. Now it is time to create our first angular application.

Run below command in a terminal/console window, which generates a new angular project and folder structure for you.

ng new my-first-app

Note: Patience, please. It will install npm packages and create a folder structure for your application.

Run your application:

Go to the project directory by running below command.

cd my-first-app

Run below command to open your application in the browser.

ng serve --open

The ng serve command launches the server watches your files and rebuilds the app as you make changes to those files.

Using the –open (or just -o) option will automatically open your browser on http://localhost:4200/.

Finally, Update app.component.ts file “title” property automatically browser will reload with your changes.

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

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {

  title = 'Hello from TechXposer!!!';

}

 

 

 

 

hip hip hurray… Now you could see your first angular application running successfully. 🙂

Other useful commands and notes:

# MyFirstApp
This project was generated with [Angular CLI](https://github.com/angular/angular-cli) version 1.0.4.
## Development server
Run `ng serve` for a dev server. Navigate to `http://localhost:4200/`. The app will automatically reload if you change any of the source files.
## Code scaffolding
Run `ng generate component component-name` to generate a new component. You can also use `ng generate directive|pipe|service|class|module`.
## Build
Run `ng build` to build the project. The build artifacts will be stored in the `dist/` directory. Use the `-prod` flag for a production build.
## Running unit tests
Run `ng test` to execute the unit tests via [Karma](https://karma-runner.github.io).
## Running end-to-end tests
Run `ng e2e` to execute the end-to-end tests via [Protractor](http://www.protractortest.org/).
Before running the tests make sure you are serving the app via `ng serve`.
## Further help
To get more help on the Angular CLI use `ng help` or go check out the [Angular CLI README](https://github.com/angular/angular-cli/blob/master/README.md).

Happy Coding 🙂