Basics Of ASP.NET MVC In Depth

Synopsis

  1. Introduction
  2. Definition
  3. Advantages
  4. Disadvantages
  5. Flow of MVC
  6. Routing
  7. Simple MVC Form

Introduction

MVC is a one of the famous design patterns for developing web applications, websites and web pages. It is much easier for developers compared to traditional ASP.NET. MVC has a lot of advantages. MVC is the latest trend in the word. This article explains about the basic structure of MVC and how to handle the MVC applications.

Definition

Model View Controller (MVC) is a design pattern or methodology. It is used to effectively develop web applications. MVC is a not complex one, we can learn it easily.

Advantages

There are many advantages available in MVC.

  • A separation of concern is a main advantage of MVC. It means we can divide into three part of the application like Model, View and Controller.
  • Handles the code easily because of separation of concern.
  • In the same time we can split many developers' work at one time. It will not affect one developer's work to another developer's work.
  • It supports TTD (test-driven development). We can create an application with unit test. We can write one test case.
  • Latest version of MVC supports default responsive web site and mobile templates.
  • We can create our own view engine. Its syntax is very easy compared to traditional view engines.

Disadvantages

  • Cannot see design page preview like .aspx page. Every time we want to run it, then we see the design.
  • Understanding flow of application is very hard. It is a little bit complex to implement and not suitable for small level applications.
  • Its deployment is a little bit hard.

Basic Work Flow of MVC

MVC work flow is different compard with ASP.NET. First understand MVC work flow,  then you need to know every one. The below diagram explains the work flow of MVC.

MVC Work Flow
Figure 1: MVC Work Flow

Routing

Routing finds the available URL Request from which one user is given the URL. Routing is a pattern matching system with the help of a routing table. Routing table contains all available routes based on controller and action. If a URL is entered, the routing engine compares the given URL with the route table. If the given URLis  not available it shows an error, otherwise it renders corresponding page.

Routing
Figure 2: Routing

Route Table

Routing table contains all possible ways of the URL based on controller and action methods. Whenever you enter the URL in the browser the routing engine matches it with the route table. The below screen shot shows how many action methods are available in one controller.

In “Home” the controller contains three action methods, so three different ways of URL requests are possible. I have different controller and action possible ways of URL request increases. All URL requests are based on controllers and actions.

Action Results
Figure 3: Action Results

Possible method of URL Request below:

  • http://localhost:1319/Home/index
  • http://localhost:1319/Home/About
  • http://localhost:1319/Home/Contact

If any other URL request is given it shows an error like the below screen shots.

Error Page
Figure 4: Error Page

Simple MVC Application

Follow the below steps for opening a simple MVC default application. You can learn many concepts from MVC default application. MVC 5 is available in Visual Studio 2013 and above.

  1. Open Microsoft Visual Studio then choose New Project then show the screen as below.

    New Project Window
    Figure 5: New Project Window

  2. Click Web and select ASP.NET Web Application. Give specified name in Name Colum; if you need to choose which location your project wants to store then click Ok button.

  3. After clicking Ok then select a template need like Empty, Web Forms, MVC , Web API and Single Page Application.

    Project Template Window
    Figure 6: Project Template Window

  4. Select MVC as in the above image. If you need unit testing for your application select the add unit tests check box.

  5. Directly host our application in cloud using Hosting in Cloud option marked in red. If you want to host in the cloud you need to register and get a cloud account.

  6. Finally click the ok button then it takes a few minutes to open the application. After opening we can see what the necessary folders onthe right side are inthe   coding page of MVC.

    Project Folders
    Figure 7: Project Folders

  7. App_Data, App_Start, Content, Fonts, Model, Script, Views and Web.Config are available in Solution Explore.

  8. In default application you do not need to do any coding, it has everything,  just run it, you can see the output shown below.

     Final Application Output
    Figure 8: Final Application Output

Conclusion

MVC support responsive websites with the help of bootstrap. It is the default available in MVC 4 and above. This article helps  those who have just learned MVC as well as explaining basic concepts of MVC. You can learn advanced concepts of MVC in a future article.

Read more articles on ASP.NET MVC: