Develop Debug and Publish an ASP.NET Core Application Using Visual Studio Code

This Article helps you to Understand- Develop, Debug and Publish an ASP.NET Core Application Using Visual Studio Code

Microsoft created Visual Studio Code (VS Code), a free, cross-platform, and compact source-code editor, for use with Windows, Linux, and Mac computers. Unlike Visual Studio, which is an IDE, it is a source-code editor (integrated development environment). Like Visual Studio, VS Code enables development activities like task execution, debugging, and version control.

Prerequisites Sofwares
Installing the following software on your computer is recommended:

• .NET Core SDK
• Node.js
• Visual Studio Code

Install essential extension (of VSCode)

• C# extensions - Required for creating ASP.NET Core applications. Please click the extensions icon on the left side of the menu to access the list of extensions, or press Ctrl + Shift + X on your keyboard to shortcut.
• NuGet Gallery extension- Requried to add and update NuGet packages in the VS Code.
  
  

CLI (Command Line Tool - VsCode)
Since Visual Studio Code does not have any built-in tools for creating ASP.NET Core projects, it requires some manual effort to develop them.We have access to a variety of command-line tools. -

1. Yeoman command-line tool
   Yeoman command-line tool (https://yeoman.io/), which offers the ability to create a new ASP.NET Core project. Because it depends on Node.js, you should install it on your computer. Command to install Yeoman with gulp and Bower in the global location

   npm install -g yo generator-aspnet gulp bower

2. The .NET command-line interface (CLI)
   The .NET command-line interface (CLI) is a cross-platform toolchain for developing, building, running, and publishing .NET applications. The .NET CLI is included with the .NET SDK (Install .NET Core)

   Run the dotnet command in the terminal
   > dotnet
   
   
   check the version of .Net Core SDK installed in your system
   > dotnet --version

Create a single ASP.NET Core application

• Create an empty directory in the local disk
• Open that empty directory in VS Code by selecting File -> Open Folder.
• Open the terminal by using the shortcut Ctrl + Shift + ` or Terminal -> New Terminal.
• Check type of ASP.NET project templates available on your machine (run the following CLI command) and create an Empty Project
  • if Yeoman CLI
        yo aspnet
              it will show you the list of ASP.NET project templates.
              Select the web application option. It requests the UI framework be used in the project. Select Bootstrap from the list
              After selecting the UI framework, the console will request the application name
              It will produce project templates with the controller and views after you enter the application's name, much like a Visual Studio project would
  •  if .net CLI
        dotnet new --help
             Run dotnet new web --name --no-https  in order to create an empty ASP.NET Core web application.
             On executing the command, ASP.Net Core Empty template will be created followed by the dotnet restore command.
• Now change the directory to the project location  

Update the .NET Core version
update the .NET Core version in the global.json file

Build the Source
Now, build the source using the following command

dotnet build

The source will be built and show the errors, if any.

Generate the solution file
CLI will generate only the project templates, not the solution file (.sln) for the project
So, generate the solution file for the projects using the following command.  directory you currently resid

dotnet new sln
//The solution file will be automatically named the same as the directory you currently reside

Create multiple ASP.NET Core projects inside a single solution

Create a New Solution
Let’s begin by creating a new folder for storing the solution and project files and folders

dotnet new sln

The solution file will be automatically named the same as the directory you currently reside in

Why Use a Solution in Visual Studio Code?
The solution file is traditionally used by Visual Studio to keep track and organize all of the project files in your application. However, the solution file isn’t necessarily required in Visual Studio Code, it’s optional.

There are a couple of reasons why you might want to use a solution file in Visual Studio Code:
If you or another developer would like to maintain the application in Visual Studio in addition to Visual Studio Code. Instead of building each project separately using the .NET CLI, we can use the command ‘dotnet build DiceRollerApi.sln’ to build the entire solution.


Create a New Class Libraries
dotnet new classlib -n Infrastructure
dotnet new classlib -n Persistence
dotnet new classlib -n Domain
dotnet new classlib -n Application

Create a New Web API Project
dotnet new webapi -n Education.WebApi

Add reference of above project in solution
Because we’re using the .NET CLI and Visual Studio Code, we’ll need to Add All 4 Projects to our solution file manually
dotnet sln add Infrastructure/Infrastructure.csproj
dotnet sln add Persistence/Persistence.csproj
dotnet sln add Domain/Domain.csproj
dotnet sln add Application/Application.csproj
dotnet sln add Education.WebApi/Education.WebApi.csproj

Add Reference of Class Libraries
Add Reference of Domian Class Library in Application and Persistence Class Libraries
dotnet add Persistence/Persistence.csproj reference Domain/Domain.csproj
dotnet add Application/Application.csproj reference Domain/Domain.csproj

Add Reference of Application Class Library in Infrastructure Class Library
dotnet add  Infrastructure/Infrastructure.csproj reference Application/Application.csproj

Add Reference of Persistence Class Library in Application Class Library
dotnet add  Application/Application.csproj reference Persistence/Persistence.csproj

Add Reference of Application and Infrastructure  Class Libraries in WebAPI
dotnet add  CraftScholars.WebApi/CraftScholars.WebApi.csproj reference Application/Application.csproj
dotnet add  CraftScholars.WebApi/CraftScholars.WebApi.csproj reference Infrastructure/Infrastructure.csproj

Run the project
Now, let’s run and debug the source in the VS Code editor. To run the source:-
Use command line tool with the command  dotnet run.


IMP: Only the source can be run when using command line tools. The VS Code won't attach the browser to display the outcome. We need to use a few other commands in addition to the dotnet launch command to attach the browser to the editor.Therefore, it is preferable to use VS Code's built-in option for running and debugging the source.

Config Files: task.json file and launch.json file to Run our Project

• task.json file
  We need to include the tasks.json file before launching the source. It will include instructions for executing scripts and creating sources. If not, we must always utilise the command line tool before running the source. VS Code tasks can be set up to launch scripts and initiate processes. Thus, without having to input any commands or create any code, VS Code will utilise a number of the currently available tools.
  • Create the tasks.json file and build the source:
    • Use the shortcut Ctrl + Shift + P to open the command palette.
    • Select the Tasks: Configure Task option in the command palette.
    • Select Create tasks.json file from template from the command palette. It will display the list of build tools. Select the .NET Core option from the list
    • We may run and debug the source code by selecting Run from the left menu. You will be prompted to create the launch.json file when you click Run.
• launch.json file
  The configurations to execute and debug the source will be in the launch.json file. Without this file, debugging in VS Code is not possible. By default, the launch.json file will have the launch configuration for the console, and we should configure it to the web.In the launch.json file, the Add Configuration floating button will be available at the bottom. It will list a set of configurations that can be used to debug the console app, Node.js, and so on.