How to Setup and Run Angular App in Visual Studio Code 2024

If you are looking to develop Angular applications in Visual Studio Code, you have come to the right place. In this article, we will guide you through the steps of setting up and running an Angular app in Visual Studio Code.

Step 1: Download and Install Visual Studio Code

Before you can start developing Angular apps in Visual Studio Code, you need to download and install the latest version of Visual Studio Code. You can download Visual Studio Code for free from the official website.

Step 2: Install Angular CLI

To create and manage Angular projects, you need to install Angular CLI, which is a command-line interface tool for Angular. You can install Angular CLI using npm, the Node package manager. Open a terminal in Visual Studio Code and run the following command:

npm install -g @angular/cli

Step 3: Create a New Angular Project

Once you have installed Angular CLI, you can create a new Angular project in Visual Studio Code. Open a terminal in Visual Studio Code and run the following command to create a new Angular project:

ng new my-angular-app

Step 4: Open the Angular Project in Visual Studio Code

After creating a new Angular project, open the project folder in Visual Studio Code. You can do this by going to File -> Open Folder and selecting the folder of your Angular project.

Step 5: Run the Angular App

To run the Angular app in Visual Studio Code, open a terminal and navigate to the project folder. Run the following command to start the development server:

ng serve

This will compile the Angular app and start a development server. Open a web browser and navigate to http://localhost:4200 to see your Angular app running.

That’s it! You have successfully set up and run an Angular app in Visual Studio Code. Happy coding!