Click here to Skip to main content
15,353,676 members
Articles / Web Development / ASP.NET
Article
Posted 17 Dec 2014

Stats

51.9K views
72 bookmarked

Learn ASP.NET in MVC Style: Part 1 - Introduction to ASP.NET MVC 5

Rate me:
Please Sign up or sign in to vote.
4.73/5 (27 votes)
17 Dec 2014CPOL11 min read
This article provides an overview of the web application framework ASP.NET MVC 5.

Table of Contents

This article will cover the following topics:

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:

Roadmap

The following is the roadmap of the series so far:

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's 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 MVC5. 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 MVC5.

Image 1

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' principle. This principle 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 in 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 latest ASP.NET MVC 5 framework.

Getting Started

Model-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), but it has also formed a fundamental part of how the internet works.

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.

Image 2

Real World Analogy of Model-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.

Image 3

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.

From MVC to ASP.NET MVC

ASP.NET MVC

ASP.NET MVC is 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. The main objectives of the framework 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 Image 4

Create Your First ASP.NET MVC5 Application

A good way to start learning 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 ASP.NET MVC5 framework:

Step 1: Open Visual Studio and create a new project and name it as 'MVC5Demo'. 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.

Image 5

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.

Image 6

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.

Image 7

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.

Image 8

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

Image 9

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.

Image 10

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.

Check the Version of ASP.NET MVC Application

Until now, we have created a web application and I'm constantly telling you that we are using the latest ASP.NET MVC5 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 <assemblyBinding></assemblyBinding> 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.

Image 11

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.

Image 12

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.

Image 13

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

Image 14

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

Image 15

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

Image 16

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

Image 17

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.

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

Example

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

Point Of Interest

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

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Share

About the Author

iSahilSharma
Software Developer
India India
I write code for a living; sometime blogs about it.

Comments and Discussions

 
Generalits too good Pin
Member 1338685530-Aug-17 21:28
MemberMember 1338685530-Aug-17 21:28 
GeneralRe: its too good Pin
iSahilSharma12-Sep-17 18:43
MemberiSahilSharma12-Sep-17 18:43 
PraiseGreat organization and illustration Pin
AbbottF10-Mar-17 3:59
professionalAbbottF10-Mar-17 3:59 
GeneralRe: Great organization and illustration Pin
iSahilSharma20-Mar-17 1:17
MemberiSahilSharma20-Mar-17 1:17 
QuestionGreat Article Pin
Guray Cemberci20-Jan-15 23:05
MemberGuray Cemberci20-Jan-15 23:05 
AnswerRe: Great Article Pin
iSahilSharma21-Jan-15 0:57
MemberiSahilSharma21-Jan-15 0:57 
QuestionThanks a lot. Pin
Member 113496613-Jan-15 4:15
MemberMember 113496613-Jan-15 4:15 
AnswerRe: Thanks a lot. Pin
iSahilSharma4-Jan-15 18:48
MemberiSahilSharma4-Jan-15 18:48 
QuestionThanks Pin
Ronald.A29-Dec-14 8:12
MemberRonald.A29-Dec-14 8:12 
AnswerRe: Thanks Pin
iSahilSharma29-Dec-14 18:11
MemberiSahilSharma29-Dec-14 18:11 
GeneralThanks. Pin
Gorlov22-Dec-14 7:21
MemberGorlov22-Dec-14 7:21 
GeneralMy vote of 5 Pin
Humayun Kabir Mamun17-Dec-14 20:23
MemberHumayun Kabir Mamun17-Dec-14 20:23 
GeneralRe: My vote of 5 Pin
iSahilSharma17-Dec-14 20:39
MemberiSahilSharma17-Dec-14 20:39 
GeneralAWESOME! Pin
GreatOak17-Dec-14 3:01
professionalGreatOak17-Dec-14 3:01 
GeneralRe: AWESOME! Pin
iSahilSharma17-Dec-14 18:30
MemberiSahilSharma17-Dec-14 18:30 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.