ASP .NET 5 Web App Dev Thru VS Code

            Happy Holi to all you out there!! With this blog, let's move out from the conventional VS IDE to Visual Studio Code by developing a sample web app using ASP.NET 5. Before that How To Do? want to discuss with you about three concepts as an early bird to pick you up on the latest happening on ASP .NET.

I) Web Development under ASP.NET stack

Client Side Package Distribution – By this time, you all knew about the Nuget Package Manager / Console to get the packages. For example you need to use JSON serialiser, you don’t reinvent it, as its available in the NewtonSoft JSON., which you get from the NuGet Library. But now, the client packages., (for eg., getting of any js script plugins, etc.,) could be handled here after via Bower.

No Servers - Only Servlet (Threads) – Running your Web App under IIS local Manager / IIS Express bundled with VS., here after no need of debugging your web apps under those heavy servers, all that you need is to run your node (fork it!!).

II) ASP.NET 5

As discussed on my last blog, here is the difference in ASP.NET 4.6 and Core 1.0 is spotted out from the below image :

Which one to use? – ASP. Net 4.6 is matured platform, ready to production, consists of full framework’s capabilities. On other hand, Core 1.0 has got ASP.NET MVC and Web API right now.

World of Caution : Migration from 4.6 to 1.0 will include the tedious re-codes, still some of the base libraries were not included in the 1.0.

III) Pre - Requisites To Be Installed.

1.     Install VS Code from http://code.visualstudio.com/

2.     Install Node.js – from http://nodejs.org

3.     Install Git. – http://git-scm.com/downloads

Installed Visual Studio Code Window

STEP-1:

Enter the following command at your command prompt and do the system re-start.

@powershell -NoProfile -ExecutionPolicy unrestricted -Command "&{$Branch='dev';iex ((new-object net.webclient).DownloadString('https://raw.githubusercontent.com/aspnet/Home/dev/dnvminstall.ps1'))}"

STEP-2:

After the system re-boots., issue the below commands in command prompt.

dnvm upgrade        // to download DNX [.NET Execution Environment]

dnvm list                    // will list the details of the available run-times.

(dnvm stands for - dot net version manager)

STEP-3:

Install the following packages, from Command prompt :

Yeoman - http://yeoman.io/ - for application scaffolding
                            
                                              npm install -g yo

Grunt - http://gruntjs.com/ - javascript task runner.

                  

                                             npm install grunt

Bower - http://bower.io/ - Client side package manager.

                                       

                                  npm install generator-aspnet bower

STEP-4:

To Create the ASP.NET Web Application project:

yo asp.net          // the following welcome screen is shown

Welcome Screen, to choose your project template.

select the application type and give a name to your project., my current selection is given below in the image:

List of generated files for the MVC

Now, have created the project "HelloWorld" the bottom part of the above image, discussed about the other commands for you to work, with. 

[To move from the command prompt to Visual Studio Code. give: code . from the 

downloaded project location.]

STEP - 5

To run the web app locally, from the command palette of VS code., give 

dnx: Run command

followed by 

dnx web - (HelloWorld). 

Open up a browser. and navigate to the url: http://localhost:5000

"HelloWorld" - App - Created.

For better images used in this blog, you can get it from here

Happy Configuring :)