Introduction

This tutorial aims to guide beginners through the installation and setup of Angular CLI. Angular CLI (Command Line Interface) is a powerful tool that simplifies the process of initializing, developing, and maintaining Angular applications. By the end of this tutorial, you will learn how to install Angular CLI and create your first Angular project.

Prerequisites: Basic understanding of web development and Node.js environment is beneficial but not mandatory.

Step-by-Step Guide

1. Install Node.js and npm

Angular CLI requires Node.js and npm (Node Package Manager) to manage its dependencies.

You can download and install Node.js from the official website. The npm comes bundled with Node.js.

To verify the installation, open your terminal and type:

node -v
npm -v

Both commands should return a version number.

2. Install Angular CLI

Once Node.js and npm are installed, you can install Angular CLI by running the following command in your terminal:

npm install -g @angular/cli

The -g option installs Angular CLI globally so that you can use it from any directory.

To verify the installation, type:

ng --version

This command should return the Angular CLI version number.

3. Create a new Angular project

To create a new Angular project, navigate to the directory where you want to create the project and type:

ng new my-angular-app

Replace "my-angular-app" with the name of your project.

The CLI will prompt you to choose a stylesheet format and whether to include routing. Choose as per your requirement.

Code Examples

1. Installing Node.js and npm

# Verify Node.js installation
node -v
# Output: v14.15.4

# Verify npm installation
npm -v
# Output: 6.14.10

2. Installing Angular CLI

# Install Angular CLI
npm install -g @angular/cli

# Verify Angular CLI installation
ng --version
# Output: Angular CLI: 11.2.6

3. Creating a new Angular project

# Navigate to the desired directory
cd /path/to/directory

# Create a new Angular project
ng new my-angular-app

Summary

This tutorial covered the installation of Node.js, npm, and Angular CLI, and the creation of a new Angular project. You can now move on to developing your Angular application.

For a deeper understanding of Angular, refer to the official Angular documentation.

Practice Exercises

1. Install Node.js and npm, verify their installations.
2. Install Angular CLI, verify its installation.
3. Create a new Angular project with a different stylesheet format and with routing enabled.

Solutions:

1. Node.js and npm can be installed from the official Node.js website. Verify their installations using node -v and npm -v.

2. Angular CLI can be installed using npm install -g @angular/cli. Verify the installation using ng --version.

3. To create a new Angular project with a different stylesheet format and with routing enabled, run ng new my-angular-app. When prompted, choose the desired stylesheet format and type "y" for routing.

For further practice, try creating multiple Angular projects with different configurations.