Getting Started With ASP.Net Web API 2: Day 2

Introduction

Before reading this article, I highly recommend reading the previous part:

• Getting Started With ASP.Net Web API 2 : Day 1 

As we saw in my previous article about the Web API 2, we have learned some advantages and features of the Web API.

In this article we will learn the ASP.NET Web API to do a MVC application. In a general way the ASP.NET Web API is bundled with a MVC project template in Visual Studio 2012 or 2013. There are two ways to work with the Web API, either choose MVC template and install all the necessary packages from the NuGet Package Manager or choose the Web API template. In both approaches, including the Web API in an ASP.NET web application project is equivalent because the project wizard simply installs the Web API from NuGet.

The main difference between MVC and the Web API is that since version 2 of the framework, the Web API handler, HttpControllerHandler, is a subclass of HttpTaskAsyncHandler, whereas the MVC version, MvcHandler, implements IHttpAsyncHandler directly. HttpTaskAsyncHandler is .NET 4.5 only, that is the only .NET version supported by Web API 2.

When we run both, the MVC and the Web API in the same ASP.NET process, ASP.NET will use the HttpApplication. The MapRequestHandler event determines which of the HTTP handlers will be selected to handle the incoming request. At this scenario, the route matching happens and the request flows through the IRouteHandler relevant to the selected route. The sole purpose of IRouteHandler is to produce an IHttpHandler that can handle the request. If the IRouteHandler is HttpControllerRouteHandler (Web API route), then the Web API path will be chosen and the request will end up in the HttpControllerHandler. Conversely, if the route handler is MvcRouteHandler, then the MVC path takes over via MvcHandler.

Prerequisites

There are the following things we need to use when developing a Web API application:

• Visual Studio 2013
• ASP.NET Web API

Getting Started

So, let's proceed with the following sections:

• Create ASP.NET Web Application
• Adding Web API 2 Controller

Create an ASP.NET Web API 2 Application

Under this section, we will create an application based on the Web API 2 with MVC. There are some basic steps that we need to follow.

Step 1

Open Visual Studio 2013 and click New Project.

Step 2

Select the ASP.NET Web Application and provide a nice name for the application.

Step 3

In this step, we need to choose Web API template and hit the Enter key or Ok button.


  
Step 4 

Add a class file for student and define the properties of student.

namespace Practice3.Models
{
    public class Student
    {
        public int Id { get; set; }
        public string Name { get; set; }
        public string Address { get; set; }
    }
}

Step 5

Add another class for adding some records using a List.

namespace Practice3.Models
{
    public static class Students
    {
        public static List<Student> List = new List<Student>
        {
            new Student{Id=1, Name="rajeev Ranjan", Address="Noida"},
            new Student{Id=2, Name="Nimit", Address="Noida"},
            new Student{Id=3, Name="Anil", Address="Noida"},
            new Student{Id=4, Name="Manish", Address="Noida"},
            new Student{Id=5, Name="Upankar", Address="Noida"},
            new Student{Id=6, Name="Papon", Address="Noida"},
            new Student{Id=7, Name="Anurag", Address="Noida"}

        };
    }
}

Step 6 

Add two controllers, one for MVC and another for the Web API. The MVC controller has two Views.

• Code for MVC controller
  

  namespace Practice3.Controllers.Mvc
  {
      public class StudentsController : Controller
      {
          // GET: Students
          public ActionResult Index()
          {
              return View(Students.List);
          }
          public ActionResult Details(int id)
          {
              var stud = Students.List.FirstOrDefault(x => x.Id == id);
              if (stud == null) return new HttpNotFoundResult();
              return View(stud);
          }
      }
  }

• Code for Web API Controller
  

  namespace Practice3.Controllers.WebApi
  {
      public class StudentsController : ApiController
      {
          public Student GetById(int id)
          {
              var stud = Students.List.FirstOrDefault(x => x.Id == id);
              if (stud == null) throw new HttpResponseException(HttpStatusCode.NotFound);
              return stud;
          }
      }
  }

Step 7

In this step we will write some codes for displaying  Web API data in the web page.

Index Page

@model System.Collections.Generic.List<Practice3.Models.Student>
@{
ViewBag.Title = "Title";
}

<dl>
@foreach (var stud in Model)
{
<dt>@stud.Id. @stud.Name . @stud.Address</dt>
<dd>@Html.ActionLink(stud.Name, "Details", "students", new {id=stud.Id},null)</dd>
}

</dl>

Details Page 

@model Practice3.Models.Student
@{
    ViewBag.Title = "Details";
}
<div class="jumbotron">
    <h1> @Model.Name</h1>
    <p class="lead">@Model.Address</p>
    <p><a class="btn btn-default" href="/api/Students/@Model.Id"> Link »</a></p>
</div>

Output 

As we hit F5 to run the application, we can see the output, something like this: 



After hitting the link button we can see the output: 



If we wish to see the data in JSON format then we need to hit the link button, as shown in the output screen, then we can see the JSON format of a specific row.



Summary

In this article, we have learned the basic steps for creating a Web API in MVC. From future articles we will be able to understand more about the Web API.

Further Readings

<< Getting Started With ASP.Net Web API 2 : Day 1                  >> Getting Started With ASP.NET Web API 2 :Day 3