• About Me
  • Contact Us
  • Privacy Policy
  • Terms and Conditions
  • Advertise / Sponsor

DOTNET DETAIL

Learn Microsoft .NET Technologies

  • Home
  • Tutorials
    • Angular
      • Angular 5
      • Angular 6
    • ASP.NET Core
    • Azure
    • React
    • Vue
  • Books
  • Courses
  • Cloud Hosting
  • Interview Questions
You are here: Home / Angular / How to setup a project with Angular 6 & ASP.NET Core 2.1 using VS Code

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

May 28, 2018 by mebakar1005 Leave a Comment

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.

See also  What is Entity Framework Core in ASP.NET Core 2.0

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.

 

How to Create Service in Angular 5
How to create CRUD operations using Angular 6 and ASP.NET Core 2.0

Related

Filed Under: Angular, Angular 5, Angular 6, ASP.NET Core Tagged With: Angular 6, Angular 6 Setup, Angular 6 Tutorial, ASP.NET CORE, ASP.NET CORE 2.0, ASP.NET Core 2.1

Leave a Reply Cancel reply

Your email address will not be published. Required fields are marked *

Buy me a coffeeBuy me a coffee

Jobs

Dotnet Jobs

Join Us

Join Us

Subscribe to Blog via Email

Enter your email address to subscribe.

Recent Posts

  • Overland Park: más grande suburbio de Kansas City es en realidad un romántico Destino lleno de Exterior Actividades, Comida excelentes y Cultura
  • Lasting Online Dating Sites: Techniques For Survival
  • Very best Antiviruses Designed for PC Game enthusiasts
  • Very best Antivirus Software
  • Realmente Hace Él En absoluto como yo ?
  • Fiscal Planning — What You Need to Know
Copyright © 2022