Create Angular 4 Project In Five Minutes

There are many ways to create Angular projects. Here we are doing it with Angular CLI

With the CLI you can have a new webpack based project set up and running within minutes with almost zero manual configuration.

Prerequisites

As per angular CLI team, you need node 6.9.0 or higher, together with npm 3 or higher to run the CLI and Angular project

Download CLI

Need to install CLI globally via NPM

  1. npm install -g @angular/cli  

Create Project

Once CLI is installed, you go the folder /drive , where you want to create new project. Use your favorite command line editor. Run the following command.

  1. ng new PROJECT_NAME  

Replace PROJECT_NAME with your desired project name (without spaces)

That is it. CLI will now generate all the project files and install required modules.
 
Run Project
 
Running the project is just as simple. Use the below command to serve up the local envionment
  1. npm start  
 OR
  1. ng serve  
As everything builds, your new angular app is visible at 
  1. http://localhost:4200/  
Ready to GO! 
 
Angular CLI provides many scaffold templates. You can give it try.  The most-used templates are below. it will create structure and files for you. You need to just work on your application logic.
 
 Scaffold Usage
 Component ng g component my-new-component
 Directive ng g directive my-new-directive
 Service ng g service my-new-service
 Class ng g class my-new-class
 Interface ng g interface my-new-interface
 Enum ng g enum my-new-enum
 Module ng g module my-module
 
Conclusion
  1. Super quick and easy to configure Angular project with CLI.
  2. Webpack, Protractor e2e testing, Karma/Jasmine testing setup automatically.
  3. All dependencies modules installed automatically.
  4. Centralized configuration via an Angular CLI config file
  5. Easy CLI commands to create components, modules  
It is an ideal solution for beginners to play with Angluar. 
Ebook Download
View all
Learn
View all