Printing and PDF export are disabled for this content. View it online at Full Stack Learning Simplified.

Angular Setup with the CLI

The Angular CLI scaffolds, runs, builds, and generates code for your project. It's central to the Angular workflow — you'll use it constantly.

Create and run

bash

npm install -g @angular/cli
ng new my-app
cd my-app
ng serve

ng serve starts a dev server at http://localhost:4200 with live reload on every change.

Generating code

The CLI generates components, services, and more — with the right files, boilerplate, and naming — so you don't create them by hand.

bash

ng generate component product     # or: ng g c product
ng g service data                 # a service
ng g guard auth                   # a route guard
ng g pipe currency-format         # a pipe

Project structure

project

my-app/
├─ src/
│  ├─ main.ts              # bootstraps the app
│  ├─ app/
│  │  ├─ app.component.ts  # root component
│  │  ├─ app.config.ts     # app-wide providers
│  │  └─ app.routes.ts     # route definitions
│  └─ index.html
└─ angular.json            # CLI/build config

Common commands

Command	Does
`ng serve`	run the dev server
`ng build`	production build
`ng test`	run unit tests
`ng generate`	scaffold code

Tip: Let the CLI generate everything — components, services, guards, pipes. It follows Angular conventions and wires files up correctly, saving time and keeping the project consistent.

Free preview. Sign in and subscribe to unlock all 809 lessons across 25 courses.