How to setup a project with Angular 6 & ASP.NET Core 2.1 using VS Code

In this tutorial, we will take a look at how to create a project with Angular 6 and ASP.NET Core 2.1 using visual studio code. And I will use angular project template (single page project templates) to create a new project.

Angular 6 with ASP.NET Core 2.1 Application using VS Code

Let’s create a new Angular 6 project with ASP.NET Core 2.1 using Visual Studio code in step by step.

Step # 1: Create a Project folder

Open Visual Studio Code => go to VS Code terminal by pressing ctrl + ` (left key of number 1 key) => write the below command in the command terminal.

mkdir bookstore

So, it will create a new folder with the name of “bookstore”. Now go inside this folder using below command.

cd bookstore/

Step # 2: Create a Project

Note: – As you know, we are using the latest version of ASP.NET Core, so we don’t need to install other packages to create a project. If you are using asp.net core 2.0, then make sure you have installed the updated angular project template.

Now, write this below command to create an asp net core project with angular.

dotnet new angular

If you want to create an asp net core project with react, then write this below command in the command terminal.

dotnet new react

If you want to create an asp net core project with redux, then write this below command in the command terminal.

dotnet new redux

After running that particular command successfully, you will see the message from the terminal as you see in below screenshot.

And command terminal will also give you the important message as you see below.

“Important: Before running this project on the command line,

You must restore NPM packages by running “npm install””

So, to restore npm packages you need to run this below command.

npm install

Then this command will restore all the npm packages that you need for your project. And you will see the bunch of files and folders are created in your “bookstore” folder.

Step # 3: Run your project

Now, run your project by using this below command.

dotnet run

This above command will give you a URL like this “http://localhost:500” and some other instructions like this below screenshot.

Now, paste that URL into browser and press enter. Then you will see the result in your browser as you in the below screenshot.