Tutorial

Using the Angular CLI to Get Up and Running With Angular

Published on September 23, 2016
author

Alligator.io

Using the Angular CLI to Get Up and Running With Angular

Many moving parts are involved in any Angular project, and the Angular CLI (Command Line Interface) is a new tool that makes it easy to get projects started, generate components, routes or services, serve your projects and to run tests.

This post covers Angular 2 and up.

Installing the Angular CLI

The first step is to install it from npm:

$ npm install -g @angular/cli

This will install the Angular CLI globally. If npm complains, then try running the command with sudo:

$ sudo npm install -g @angular/cli

Starting a new project

First use your terminal to navigate to a directory that will be the parent directory of your project, then run this command:

$ ng new app-name

This will create an Angular project with everything in place for your to get started coding right away! Here’s an example of how the directory structure of your new project will look like:

├── README.md
├── angular-cli.json
├── **e2e …**
├── karma.conf.js
├── **node\_modules …**
├── package.json
├── protractor.conf.js
├── **src …**
└── tslint.json

Serving your project

This will run a local server at http://localhost:4200 by default. It will also watch for changes in your project and refresh the page automatically. Run this command from within the project directory:

$ ng serve

ng generate

Use ng generate to generate useful things for your project like components, routes, pipes, services and directives. For example, here’s how you would generate a component:

$ ng generate component path/component-name

Running tests

Finally, run your tests with ng test:

$ ng test

Thanks for learning with the DigitalOcean Community. Check out our offerings for compute, storage, networking, and managed databases.

Learn more about our products

About the authors
Default avatar
Alligator.io

author

While we believe that this content benefits our community, we have not yet thoroughly reviewed it. If you have any suggestions for improvements, please let us know by clicking the “report an issue“ button at the bottom of the tutorial.

Still looking for an answer?

Ask a questionSearch for more help

Was this helpful?
 
Leave a comment


This textbox defaults to using Markdown to format your answer.

You can type !ref in this text area to quickly search our full set of tutorials, documentation & marketplace offerings and insert the link!

Try DigitalOcean for free

Click below to sign up and get $200 of credit to try our products over 60 days!

Sign up

Join the Tech Talk
Success! Thank you! Please check your email for further details.

Please complete your information!

Featured on Community

Get our biweekly newsletter

Sign up for Infrastructure as a Newsletter.

Hollie's Hub for Good

Working on improving health and education, reducing inequality, and spurring economic growth? We'd like to help.

Become a contributor

Get paid to write technical tutorials and select a tech-focused charity to receive a matching donation.

Welcome to the developer cloud

DigitalOcean makes it simple to launch in the cloud and scale up as you grow — whether you're running one virtual machine or ten thousand.

Learn more