How to Create a New Angular Project?

In this tutorial, we will show you how to create a new Angular project.

To create a new Angular project, do the following:

1. Open a terminal and run the Angular CLI ng new project-name command as shown in the example below:

    ng new my-sample-angular-app
    

2. When you are prompted with Would you like to add Angular routing? Choose Yes by pressing Y.
3. When you see Which stylesheet format would you like to use? Choose CSS and press Enter.
4. After the project gets created, navigate to the project folder:

    cd my-sample-angular-app

5. Run the project by executing the following command:

    ng serve --open
    

The ng serve command starts the server, monitors your files, and rebuilds the app as you modify the files.

The —open (or simply -o) option opens your browser to http://localhost:4200/.

6. If your installation and setup was successful, you should see a page like the following on your browser, running at http://localhost:4200/:

7. Open your Angular project in Visual Studio Code IDE. If Visual Studio Code is not already installed on your machine, download and install it from https://code.visualstudio.com/download.
8. Go to the root component of the project at src\app\ and open src\app\app.component.html file. Remove everything from the file except the last line <router-outlet></router-outlet>. The <router-outlet></router-outlet> acts as a placeholder which Angular dynamically updates based on the selected route. Now, add <h1>Hello World!</h1> to the file src\app\app.component.html and make the code look like the following:
src\app\app.component.html

You will see something like this on your browser: