The Angular Command Line Interface or Angular CLI for short, makes it easy to create an application that already works, right out of the box. It follows best practices, generates components, routes, services and pipes with just a simple command. Want more? The Angular CLI can also create simple test shells for all of these.
The Angular team recommends using Angular CLI for developing your apps.
Both the Angular CLI and generated project have dependencies that require Node 6.9.0 or higher, together with NPM 3 or higher.
To know more about the Angular CLI project, head to https://github.com/angular/angular-cli
Now, let’s see how to create your first Angular 2 app using Angular Command Line Interface.
Step 1 : Install Angular CLI
Open command prompt on windows or terminal or mac and enter the following command:
npm install -g angular-cli
The command tells Node Packet Manager to install Angular CLI. “-g” in the above command tells npm to install Angular CLI globally.
Step 2 : Install TypeScript
In this post, we plan to develop our Angular 2 app using TypeScript. We need to make sure that we have TypeScript installed on your machine. To do that, simply enter the following command;
npm install -g typescript
This will install TypeScript on your machine and if it is already installed, it will display the version number.
Now that we have Angular CLI and TypeScript installed on our machine, the next step is to create the project.
Note that we start using “ng” from here on instead of “npm” and that’s because, we now have Angular CLI installed on our machine and we can make use of it’s powers!
Step 3 : Create Project
To create a new project, just type the following command:
ng new PROJECT_NAME
That should create a new project with the specified project name and all the required dependencies. Once the project is successfully created, navigate to the project’s folder using the following command:
You may have created your project in a different folder structure. Make sure you navigate to the appropriate project folder.
Step 4 : Serve your App
Once in the project folder type the following command to run your application:
What the above command does is, it starts a development server running on http://localhost:4200 and builds all the application modules.
Step 5 : Browse your App
Open your favorite browser and navigate to http://localhost:4200. You should now see your app running!
So, there you go! You have just created your first Angular 2 App using Angular CLI in just easy 5 steps.
I have also created a video tutorial on how to create your first Angular 2 App using Angular CLI. If you like the video, please hit like and subscribe to my channel.