Tuesday, September 22, 2020
[vc_custom_heading text=”Setting Up Development Environment “]

First step is  to go to https://www.microsoft.com/net/core. Here you can see the installation instructions for your operating system.

If you are a windows user, the simplest way is to install visual studio 2017 which will bring all the components we need.

In this tutorial I’ll use visual studio code on Mac. Visual studio code it’s a very light weight, cross platform and very fast editor. I’ve been using vs code for some months for developing asp.net core applications and believe me its much better.

[vc_custom_heading text=”Installing .Net Core SDK”]

First you need to to download .Net Core SDK from https://www.microsoft.com/net/core#macos

Just follow the instructions for installing .NET Core SDK in you OS version.

Then download visual studio code from https://code.visualstudio.com

Once in vs code you need to add a few extensions to be able to write C# code.

First you need to open the command pallet you need to press Shift + Command + P and type Install Extensions. This bring up the extensions panel.

You can also bring this panel up by clicking the Extension Button on the left button panel.

I recommend you to install these extensions:

C# Extensions: Provides extensions to the IDE that will hopefully speed up your development workflow.

Angular v4 Typescript Snippets: Adds snippets for Angular for TypeScript and HTML.

ASP.NET Helper:  Helper to develop faster ASP.NET MVC apps.

Finally, you need to install a couple of node packages.

Yeoman is a web scaffolding tool that helps you to kick start new projects.

In visual studio, when you create a new a project, visual studio generates a project that comes from a template, vs code doesn’t have this feature, that’s why we use Yeoman to generate the template project.

You can follow the instruction to install yeoman in more detail here:

http://yeoman.io/learning/

To install Yeoman in your system execute this command on your terminal:

sudo npm install –g yo

yo is just an engine and we can and should install templates on top of this engine.

The template we are going to use is named generator-aspnetcore-spa

Use this command to install:

npm install  -g yo generator-aspnetcore-spa

you can read more about this template here:

https://www.npmjs.com/package/generator-aspnetcore-spa

[vc_custom_heading text=”Creating ASP.NET Core Project “]

Navigate to the directory where you want to create your project.

In terminal run this command:

yo aspnetcore-spa

aspnetcore-spa is the name of the template generator we install previously

Then you need to select what framework you want to use in client side. I’ll chose Angular

and no for the question about if I want to include unit test. Finally, provide a project name.

Once the project is created we can build it by typing

dotnet run

and run it by navigating to  http://localhost:5000.

When you navigate to this address you will see a very basic app using Angular 2 on the client and ASP.NET Core on the server.