ASP.Net vNext: Part 2

What is ASP.Net vNext?

Please refer to my first article on vNext at the following URL for an introduction to vNext along with features details. You can set up Visual Studio 2014 at your non-production machine and try the following samples: ASP.Net vNext (Series 1).

My last article also talks about installation and so forth. So please go through it before proceeding.

Create a sample project

After you've installed VS2014 CTP on Windows, let's create a sample project.

"File" -> "New" -> "Project..." then  select ASP.NET vNext Empty Web Application as in the following:



In Solution Explorer you can see the two files that are required for a vNext web application: project.json and Startup.cs.



project.json: File where all the project dependencies are stored.

startup.cs: This class must contain a Configure method. It is a replacement for the Global.asax file.

Let's add MVC functionality to the preceding app, the procedure is:

• Add MVC package in project.json:
  

  {
      "dependencies": {
          "Microsoft.AspNet.Server.IIS" : "1.0.0-alpha2",
          "Microsoft.AspNet.Mvc":"6.0.0-alpha2"
      },
      "configurations" : {
          "net451" : { },
          "k10" : { }
      }
  }

• AddMvc method in startup.cs:
  

  using System;
  using Microsoft.AspNet.Builder;
  using Microsoft.Framework.DependencyInjection;
  namespace LetsWriteCode
  {
      public class Startup
      {
          public void Configure(IBuilder app)
          {
              app.UseServices(services =>
              {
                  services.AddMvc(); //it'll add the MVC framework
              });
  
              app.UseMvc(); //it'll add default routes
          }
      }
  }

• Update project structure by adding various files and folders say Controller, Views folder and CodeController.cs, Index.html. Hence it'll appear like:
  
  
  
  
• Write the following code in CodeController.cs that is adding a property in the ViewBag and returning a view:
  

  using Microsoft.AspNet.Mvc;
  namespace LetsWriteCode.Controllers
  {
      public class CodeController : Controller
      {
          // GET: /<controller>/
          public IActionResult Index()
          {
              ViewBag.message = "Welcome;
              return View();
          }
      }
  }

• Code in Index.cshtml is straightforward and meant to display a ViewBag.message:
  
  @*
  
  For more information on enabling MVC for empty projects, visit http://go.microsoft.com/fwlink/?LinkID=397860: 
  

  *@
  @{
        // Layout = "/Views/Shared/_Layout.cshtml";
        // ViewBag.Title = "Home Page";
  }
  <h3>
  @ViewBag.message
  </h3>

  
  
• Run the code the URL will look like: http://localhost:62823/Code/
  
  Note: The port number could be different on your machine.
  
  
  
  
• The folder structure will look like this:
  

Things to notice are:

• Rather than csproj file it contains kproj as project extension.
  
  
• Go to the bin folder and you'll find that there is no project DLL, for example let's write Code.dll.

The reason is because it's dynamic compiling. Now you can unleash the advantage of the Roslyn compiler, so modify the CodeController.cs file as in the following:

ViewBag.message = "Welcome to";

Now refresh the browser and see the following output:


Great work by the Microsoft team!!
 
Cloud-optimized

Its cloud optimized and very nicely integrated with Azure (Microsoft cloud). You can publish your website directly to Azure using VS2014 (please create the Azure account before, 30-days free trial). For the cloud vNext has a specific framework .Net Core Framework 4.5 (you can set that in the project properties).



All set for the cloud! Select the project in Solution Explorer, right-click and select Publish. The following screens will show up upon various operations. You can provide a unique website name and deploy it to Azure. The detailed procedure is the following.

Cloud integration

vNext is cloud enabled using Visual Studio, hence you can deploy your site directly to Azure.

What Azure is

I'm sure many people are aware of Azure, but for those unfamiliar with it let me explain it. Azure is a cloud computing platform and infrastructure (PaaS and IaaS), created by Microsoft, for building, deploying and managing applications.

If you have Visual Studio 2014 CTP2 or CTP3 setup then download the following samples and try to publish to Azure.

Advantages of cloud

I can share my point of view although this topic itself is an elaborative discussion. The cloud advantages are tremendous. As a developer you're insulated from the trouble of infrastructure and setup. The developer job is to code and push/deploy to the cloud, the rest is being addressed/taken care of by the service provider. I'm a big fan of the cloud!

Note: before you deploy to Azure, you must have an account there. A 1-month trial is free at Azure, you can try that.

Deploy to Azure

Let's understand, how to deploy at Azure:

1. Right-click the project and click Publish.
   
   
2. In the Publish Web wizard, click Microsoft Azure Websites.
   
   
   
   
3. Sign in to Azure, I hope you've created an account now.
   
   
4. Click New to create a new web site in Azure.
   
   
   
   
5. Enter a unique site name, choose a region near you and then click Create.
   
   

After the above operations are done successfully you'll see your site up there at the Azure cloud underneath Websites:



Build and Run vNext Apps from the Command Line

You can run .Net apps from the command line, not necessarily dependent on IIS/IIS Express. But there are some installations needed for them.

Install the K Version Manager (KVM) tool: Go to the command prompt and issue the following commands:

• @powershell -NoProfile -ExecutionPolicy unrestricted -Command "iex ((new-object net.webclient). DownloadString ('https://raw.githubusercontent.com/aspnet/Home/master/kvminstall.ps1'))".
  
  
• kvm install 1.0.0-alpha2 or 1.0.0-alpha3.

After this goto %USERPROFILE% and you'll find a .kre folder installed there. Please add the following folders in the PATH variable to access the kvm features:

• %USERPROFILE%\bin
• %USERPROFILE%\.kre\packages\KRE-svr50-x86.1.0.0-alpha2\bin

K commands

• All set for command prompt experience. Great!
  
  
• Open a command prompt and try kvm list.
  
  
  
  
• Go to your project location and run kre restore.
  
  

The kpm restore command resolves the dependencies listed in the project.json file and downloads the necessary NuGet packages.

The k web command starts the HTTP listener. Notice there is no explicit build step. The k web command compiles the code on the fly.

k web will also produce the same output.



Code samples:

You can download the following code from my GITHUB repository:

https://github.com/sumitjolly/DemoMVC13Sep14

Keep watching the space for my next article ASP.NET vNext Part 3 for more updates.

Twitter: @sumitjolly
Email: [email protected]

<< ASP.Net vNext (Series 1)