In Focus

ASP.NET MVC From Beginning - Part One

In this article, let us discuss the basics of ASP.NET MVP from start. We will discuss the process of data sharing from a Controller to View and action methods, with the help of a demo project.

Introduction

 
MVC stands for Model View Controller. It is a software architectural design pattern. Architectural Patterns provide design reusability and separation of code by providing the solutions to frequently recurring problems. Design Patterns help developers in identifying common problems and provide a predefined way to solve these problems. Design Patterns provide some of the best practices to refactor the code from bad practice to good practice. Patterns are a way to provide a solution for a well-known error or problem in an appropriate manner.  MVC was originated by Trygve Reenskaug at Xerox Parc (Palo Alto Research Center) in 1970 as a part of a small task.

Popular Programming Languages and their MVC Frameworks -

  • Java-Spring
  • Ruby-Ruby on Rails
  • JavaScript-AngularJs
  • Php-Cake Php
  • .Net-Asp.net Mvc

In MVC architectural patterns, application development is divided into three modules.

  1. Model
  2. View
  3. Controller

 

 ASP.NET MVC

Models- Model is a set of classes, that is responsible for data and business-related logic. Model is used to communicate with the database and describes how the data can be changed and manipulated.

Views- View describes how the application user interface is displayed. In MVC, Views are created by using C# and HTML Views get the result from the Controller and display the data to the users.

Controllers- Controller is the most important component of MVC. Controllers handle the application execution logic, take input from Views, and send data to Models. A Controller controls the overall execution flow of an application.

Features of ASP.NET MVC
 

  1. Separation of concern (SoC)
    SoC is a process of dividing application development into different modules. MVC is mainly divided into three components - Model, View, and Controller. It helps in the development process and increases the development speed.

  2. Parallel Application development
    Parallel development is a process of development of an application by multiple developers. In MVC, multiple developers can work on the same application module.

  3. Test-Driven Development
    In a test-driven development, a tester provides the guidelines to developers. MVC applications are easy to modify with the make-big changes.

  4. Clean URL
    MVC provides different routing techniques that do not depend on file systems but Controllers. These URLs are easy to perform SEO.

  5. Performance Improvement
    MVC uses only HTML controls and no server controls like ASP.NET Web Forms. Due to this, the performance is increased. MVC uses HTML controls for UI development, that makes it easy to add client-side scripting languages.

  6. Improve functionality
    In MVC, lots of new concepts like filers, routing etc. are added to make the application development faster and easier.

 

Folder structure of ASP.NET MVC application

 
To understand the folder structure of an MVC application, let us create a project. Now, open Visual Studio and create a new project. Let us now check the Solution Explorer.
 
ASP.NET MVC
App_start
 
This folder contains the application configuration files, like RouteConfig.cs, BundleConfig.cs, and FilterConfig.cs etc.
 
ASP.NET MVC

App_Data 

This folder contains the database files, like .mdf and XML files.

Content

This folder contains CSS (Cascading Style Sheet), bootstrap, images, and icon files.
 
ASP.NET MVC

Controller

This folder contains all Controller class files.
 
ASP.NET MVC

Fonts

This folder contains all font-related files.
 
ASP.NET MVC

Models

This folder contains the database logic related classes.
 
ASP.NET MVC

Scripts

This folder contains client-side script files. Both user-defined and pre-defined JavaScript files exist in this folder.
 
ASP.NET MVC

Views

This folder contains the View pages having the extension .cshtml.
 
ASP.NET MVC
 
Now, let us create our first application in MVC. Open Visual Studio and create a project.
 
ASP.NET MVC
 
Rename your project as MvcPartOne.
 
ASP.NET MVC 

Select 'MVC' in the Template section and click 'OK'. The project is created. Let us check the folder structure. The folders, such as content, script, app_start, View, Model, Controller etc. are created.

ASP.NET MVC
 
Now, right-click on the Controller folder and add a new Controller. Then, rename it as WelcomeController.
 
ASP.NET MVC
 
Now, add an action method and right-click on the method name, and add View.
  1. public ActionResult Index()  
  2.        {  
  3.   
  4.            return View();  
  5.        }  
ASP.NET MVC
 
Now, add the following line to the index method.
  1. ViewBag.msg = "Asp.net Mvc Part One";  
Add this line in View.
  1. <h2>@ViewBag.msg </h2>  

Now, run the project and check the results.

ASP.NET MVC 
 

Summary

 
In this article, we learned the basics of ASP.NET MVC, features of ASP.NET MVC and the folder structure of an MVC project. This is the first part of this article series. In this the next article, we will discuss data sharing between Controller and View and the action methods with a demo project.