Install the Angular CLI to Create and Serve an Angular Application

Mike Brocchi
InstructorMike Brocchi
Share this video with your friends

Social Share Links

Send Tweet
Published 7 years ago
Updated 5 years ago

Getting started with angular development can be difficult, with a lot of moving parts. Allow the Angular CLI to handle those complexities so you can focus on creating great applications.

In this lesson you will learn how to install the Angular CLI from npm, create a new application, serve the new application in the browser and edit it with live-reload.

[00:00] Install the Angular CLI from NPM, remembering to include the -g to indicate that you wish to install it globally. This will allow you to create applications outside the scope of any existing application.

[00:11] With the instillation complete, verify the instillation by running ng--version. Now you know you have a proper instillation of the Angular CLI.

[00:20] To create an application, type ng to activate the Angular CLI, new to indicate that you wish to create a new application, and then the name of the application you wish to create. In this case, I will use sample as the name of the application.

[00:34] By creating a new application, we've also created a new directory with the same name of the application. From that directory, you can run ng-serve to compile the application and run it.

[00:48] Take note that the application is running on local host port 4200.

[00:54] With the application now being served, you can navigate to local host port 4200 in your browser to see the application running. The Angular CLI's ng-serve provides a live reload experience. Make a change to the app component in your editor, save the file, and see the changes reflected directly in your browser.

egghead
egghead
~ 28 minutes ago

Member comments are a way for members to communicate, interact, and ask questions about a lesson.

The instructor or someone from the community might respond to your question Here are a few basic guidelines to commenting on egghead.io

Be on-Topic

Comments are for discussing a lesson. If you're having a general issue with the website functionality, please contact us at support@egghead.io.

Avoid meta-discussion

  • This was great!
  • This was horrible!
  • I didn't like this because it didn't match my skill level.
  • +1 It will likely be deleted as spam.

Code Problems?

Should be accompanied by code! Codesandbox or Stackblitz provide a way to share code and discuss it in context

Details and Context

Vague question? Vague answer. Any details and context you can provide will lure more interesting answers!

Markdown supported.
Become a member to join the discussionEnroll Today