Learn ASP.Net in MVC Style: Part 1 - [Introduction to ASP.Net MVC 5]

Introduction

I've been programming for the last two years and I started my career with ASP.NET Web Forms. I'm very happy with Web Forms and loved the Microsoft Rapid Action Development (RAD) approach. In my career of two years with ASP.NET, I saw a drastic shift in the .NET Community from ASP.NET Web Forms to ASP.NET MVC. Everyone is buzzing about the ASP.NET MVC framework and is attracted towards it.

So, I decided to taste the flavor of this framework and started learning ASP.NET MVC 5. This article series "Learn ASP.NET in MVC Style" is a collection of my study notes on it. I don't know whether it's a beginners guide to learn MVC or not, but if it helps someone in learning this popular framework, it will be a great pleasure to me. So, let's dive into the world of ASP.NET MVC 5.



If you're reading this article, not accidentally, then I assume that you are aware of the following two things:

1. ASP.NET: ASP.NET is an open source web application framework developed by Microsoft to build robust and dynamic web applications. Initially, it supports the two development methodologies Web Forms and Web Pages. Over the years, ASP.NET has introduced an alternative approach to Web Forms for developing web applications based on the MVC pattern known as ASP.NET MVC.
   
   
2. MVC: MVC stands for Model-View-Controller, is a software architectural pattern that follows the “Separation of Concerns” philosophy. This philosophy divides an application into three interconnected parts as Model, View and Controller each with very specific set of responsibilities. The goal of this pattern is that each of these parts can be developed and tested in relative isolation and then combine together to create a very robust application.

In the last 13 years since ASP.NET first came into existence on 2002, it has undergone several drastic changes from adapting the MVC architectural pattern to completely shift towards the Open Source community. As Microsoft is now following the open source philosophy, we can learn and code ASP.NET MVC on any OS platform. In this series, I'm using the Windows platform to develop web applications using the ASP.NET MVC 5 framework.

Roadmap 

The following is the roadmap of the series so far:

• Learn ASP.NET in MVC Style - Part 1 [Introduction to ASP.NET MVC5]
• Learn ASP.NET in MVC Style - Part 2 [Controller in ASP.NET MVC5]

 

Prerequisite

This article series uses the newly introduced Visual Studio Community 2013 that comes with the latest ASP.NET MVC 5 Framework. I wrote an article on how to install the Visual Studio Community 2013. You can find the link here:

• Visual Studio Community 2013: How to Install and Setup

 

Getting Started

Modal-View-Controller (MVC)

Modal-View-Controller, originally referred to as "Thing-Model-View-Controller" is a software architectural pattern introduced and implemented by Trygve Reenskaug while working at Xerox PARC in 1978. It was originally used as an architectural pattern for creating Graphical User Interfaces (GUIs).

Trygve Reenskaug wrote a complete documentation about the MVC pattern that can be found here [^]. According to the documentation, "MVC was conceived as a general solution to the problem of users controlling a large and complex data set. The MVC pattern divides the entire application into three interconnected parts so that the data that is represented to the user is kept separate from how it is stored and represent internally." The three interconnected parts of the MVC pattern are:

• Model: Is the business layer of the application and is responsible for the data access. It contains the logic to access data that will eventually be displayed to the user. It is also responsible for business rules, validations and other things related to data access. However, it is unaware of how the data is being displayed to the user.
  
  
• View: Is the user interface of the application and is responsible for rendering the data from the Model to the user. It is unaware of how the data is retrieved and can render HTML, XML, JSON and other custom types.
  
  
• Controller: As the name suggests, it controls the entire application and is considered to be the most important part of the application. It is primarily responsible for handling the user inputs. It first determines what the user wants are and accordingly communicates with the Model and supplies data to the View to be displayed to the user. Without a controller, the Model doesn't know what data to get and the View doesn't know what output to generate to the user.

Real World Analogy of Modal-View-Controller (MVC)

When learning MVC, I stumbled across an article that explains the MVC pattern with a simple real world example. I'm using the same example here. The link of the article can be found here [^].

To understand the MVC pattern in the real world, consider the case of a professional photographer. He is asked to take a picture of a beautiful bridge for the promotional event. To take the picture, the photographer must use a camera and focus on various angles for a perfect picture. The final picture is then displayed to the outer world at the promotional event.



If we follow the MVC pattern here, the bridge is the Model that can provide a beautiful picture for the event. The camera is the View whose main purpose is to capture a beautiful picture of the bridge and display it to the outer world. The photographer plays the role of a Controller and controls the entire photo-shoot. He is responsible for the end result that is displayed at the event.

ASP.NET MVC

ASP.NET MVC is the Microsoft's interpretation of the MVC pattern. On October 2007, Scott Guthrie wrote a simple application using the MVC pattern and introduced it to a bunch of developers at the ALT.NET conference. It was widely appreciated in the conference and the .NET community shows its interest to the early prototype of ASP.NET MVC code-named Scalene. It generated so much interest and excitement that on 13-March-2009, Scott Guthrie introduced the first public release of ASP.NET MVC 1.0 as an official Microsoft product.

In merely 5 years, it is widely accepted in the community and Microsoft has released 5 major releases prior to the original ASP.NET MVC 1.0. The current stable release is ASP.NET MVC 5 and I'm using the same version for this article series.

Objectives of ASP.NET MVC

The ASP.NET MVC framework provides a ton of benefits for web development. Some of the main objectives are:

1. Extensibility: The components of the ASP.NET MVC framework are designed so that they can be easily replaced or customized. By extensibility, we can swap out the built-in components with other / third party components. For example, the default view engine in ASP.NET MVC to render HTML is Razor but we have the option to use our own view engine for rendering the HTML.
   
   
2. Test Driven Development (TDD): With ASP.NET MVC, we can easily create unit tests for our application. We can also take individual components and test them in isolation from the entire application. A TDD approach adds an additional layer of defense in our application against unexpected results and errors.
   
   
3. Separation of Concerns: ASP.NET MVC provides a clean, organized and efficient organization of code. It is very helpful for a web application to scale in terms of functionalities and also promotes good design pattern.
   
   
4. URL Routing Mechanism: The routing mechanism of ASP.NET MVC is more SEO friendly than Web Forms. URLs do not need to include file-based extensions (.aspx) any more. It has an efficient method based mechanism for routing as compared to a Web Forms file based mechanism.

Release History of ASP.NET MVC

Microsoft has released 5 major releases of ASP.NET MVC prior to the original ASP.NET MVC 1.0. The following table shows the various versions and release history of ASP.NET MVC.

Table 1: ASP.NET MVC History



Creating your first ASP.NET MVC 5 Application

A good way to start learning ASP.NET MVC 5 is to create an application using the framework and becoming familiar with all the necessary steps. Let's create a simple web application using the new Visual Studio Community 2013.

Step 1

Open Visual Studio and create a new project "MVC 5Demo". It is strongly advised to click the "Web" link on the left side of the dialog for the ASP.NET MVC 5 framework. On the bottom right side of the dialog, I've checked the option "Add to Source Control". It is used to add your source code to a Version Control System (commonly TFS or GIT). It is an optional setting and you can leave it unchecked if you want to and click OK.



Step 2

The next dialog window prompts you to chose a template for your web application. Since we are creating a web application using the MVC framework, select MVC. On the bottom left side, there is an option to add Unit tests. It is a recommended approach to add unit tests to your project, however the choice is optional and you can leave it unchecked.



Step 3

On the right side, there is a button saying "Change Authentication" and by default, the selected mode is "Individual User Accounts". It provides the authentication features for your application and there are various modes to chose from. If you click on it, a dialog window appears with several options to choose from. Chose the desired option and click OK.



Step 4

You are almost done with your application. If you've selected the "Add to Source Control" option in the start, a dialog appears to ask you for the source control system for your application. Select the desired option and click OK. This step is optional and only appears if you checked the Add to Source Control option.



Step 5

After all the configurations and settings, Visual Studio creates a project for you and displays the Readme file.



Step 6

Run the project by pressing the F5 button or click Start Debugging on the IDE. Voila, you've created your first web application using the ASP.NET MVC 5 framework.



This application helps you to become familiar with ASP.NET MVC 5. In the next couple of articles in the series, we'll go in deeper and create a web application from scratch using the ASP.NET MVC 5 framework.

To Check the Version of ASP.NET MVC

Until now, we have created a web application and I'm constantly telling you that we are using the latest ASP.NET MVC 5 framework. But, there is no such moment where we have selected the framework version. So the question becomes, how to check the version of ASP.NET MVC framework in your application. There are several options by which we can check the version of ASP.NET MVC framework in our application:

Option 1: Via "Web.config" file

Open the "Web.config" file of your project and search for the <assembly Binding></assembly Binding> tag. Under it, look for the "System.Web.MVC" assembly and check for newVersion that describes the version number of the ASP.NET MVC framework. In the following image, it shows the version as "5.2.2.0". That means the latest ASP.NET MVC 5 framework.



Option 2: Via "packages.config" file

Open the "packages.config" file of your project and look for the package having id="Microsoft.AspNet.MVC". It describes the version of your ASP.NET MVC framework and in the following image, it shows the version as "5.2.2" that means the latest ASP.NET MVC 5 framework.



Option 3: Via "References" folder

Expand the References folder of your project and select the "System.Web.Mvc" assembly. Press F4 for the Properties Window and look for the version. In the following image, it shows the version as "5.2.2.0" that means the latest ASP.NET MVC 5 framework.



Option 4: Via ASP.NET MVC Diagnostics page

There is an explicit method to check the version of ASP.NET MVC 5 framework using the diagnostics page. ASP.NET MVC diagnostics is a simple ASP.NET page created by Brad Wilson, that is used to diagnose issues with an MVC application. To add the diagnostics page into your application, open the NuGet Package Manager from Visual Studio by going to:

Tools => NuGet Package Manager => Manage NuGet Packages for Solution.



Search for "ASP.NET MVC Diagnostics" and install the page.



After the successful installation, an "MvcDiagnostics.aspx" page is added to your MVC application as shown in the following application:



Run the page and it will display all the essential details (including MVC version) about your ASP.NET MVC application.



Option 5: Using the typeof() operator

This is the simple and most commonly used option where we use the typeof() operator to check the version of ASP.NET MVC.

typeof(Controller).Assembly.GetName().Version

Example

public string VersionDetails()
{
//To check the MVC version
return "The version of ASP.NET MVC is " + Convert.ToString(typeof(Controller).Assembly.GetName().Version);
}

Conclusion

I hope this article helps you to understand the basics of the ASP.NET MVC 5 framework. In the next articles, we'll dig deep into the world of ASP.NET MVC 5. Your feedback and constructive criticism is always appreciated, keep it coming. Until then, try to put a ding in the Universe!