ASP .NET MVC Basics

ASP .NET MVC Basics and Examples

 

Overview of MVC Architecture

MVC (Model-View-Controller) is a software architectural pattern commonly used in web application development. It separates an application into three interconnected components: the Model, the View, and the Controller.

1. Model The Model represents the data and the business logic of the application. It encapsulates the application's data and defines the operations that can be performed on that data. It is responsible for data validation, retrieval, and storage. In an MVC application, the Model is independent of both the View and the Controller.

2. View The View is responsible for rendering the user interface and displaying the data to the user. It presents the data from the Model to the user in a user-friendly format. The View receives input from the user and sends it to the Controller for processing.

3. Controller The Controller handles user input, processes requests, and controls the flow of the application. It receives input from the View, interacts with the Model to perform the necessary operations, and determines which View should be displayed. The Controller updates the Model and the View based on the user's actions.

The MVC architecture promotes separation of concerns, allowing for better maintainability, testability, and reusability of code. It provides a structured approach to developing web applications by dividing responsibilities among the different components.

ASP.NET MVC Framework Version History

Here is a brief overview of the version history of the ASP.NET MVC Framework:

1. ASP.NET MVC 1.0: Released in March 2009. It introduced the basic MVC pattern implementation in ASP.NET.

2. ASP.NET MVC 2.0: Released in March 2010. This version introduced features like Areas, client-side validation, and enhanced model binding.

3. ASP.NET MVC 3.0: Released in January 2011. It added Razor view engine, improved support for unobtrusive JavaScript, and introduced Global Filters.

4. ASP.NET MVC 4.0: Released in August 2012. It introduced the Web API framework, mobile project templates, and improved support for bundling and minification.

5. ASP.NET MVC 5.0: Released in October 2013. This version introduced support for ASP.NET Identity, attribute routing, and Bootstrap templates.

6. ASP.NET Core MVC: Starting with ASP.NET Core, the framework was completely rearchitected and renamed as ASP.NET Core MVC. The versions of ASP.NET Core MVC follow a different numbering scheme, with updates released more frequently.

Create First MVC App

To create a basic MVC (Model-View-Controller) application, follow these steps:

1. Open Visual Studio and create a new project.
2. Select the "ASP.NET Web Application" template.
3. Choose "MVC" as the project template and click "Create."
4. Visual Studio will generate a default MVC project structure with the necessary files and folders.
5. The project will include folders for Controllers, Models, and Views, along with other files like Startup.cs and appsettings.json.
6. You can start adding Controllers, Models, and Views based on your application requirements.
7. Define routes in the Startup.cs file to map URLs to specific controllers and actions.
8. Build and run the application to see the default home page.

This is a basic outline of creating an MVC application. You can add more functionality and customize the application as per your needs.

MVC Folder Structure

In an ASP.NET MVC application, the folder structure typically follows a convention. Here is a brief explanation of the common folders:

1. Controllers: This folder contains the classes that define the controllers for the application. Controllers handle user requests, process data, and determine the appropriate View to render.

2. Models: This folder contains the classes that represent the data and business logic of the application. Models are responsible for data validation, retrieval, and storage.

3. Views: This folder contains the UI files that define how the application's data is presented to the user. Views are typically HTML templates with embedded code for rendering dynamic data.

4. Areas: This folder is used to organize the application into smaller functional sections called "areas." Each area can have its own Controllers, Models, and Views, allowing for modular development.

5. App_Start: This folder contains configuration files and code that run on application startup. It includes files like RouteConfig.cs, which defines the routing rules for the application.

6. Content: This folder is used to store static files like CSS stylesheets, images, and client-side scripts.

7. Scripts: This folder is used to store JavaScript files that are used in the application.

8. App_Data: This folder is used to store data files, such as databases or XML files, that the application may use.

These folders provide a logical structure for organizing different components of an MVC application, making it easier to navigate and maintain the codebase.

Routing in ASP.NET MVC

Routing in ASP.NET MVC maps URLs to specific controller actions. It determines how incoming requests are processed and which controller method should handle them. The routing configuration is typically defined in the RouteConfig.cs file in the App_Start folder.

Here's an example of defining a route in ASP.NET MVC:

csharp
public class RouteConfig
{
    public static void RegisterRoutes(RouteCollection routes)
    {
        routes.IgnoreRoute("{resource}.axd/{*pathInfo}");

        routes.MapRoute(
            name: "Default",
            url: "{controller}/{action}/{id}",
            defaults: new { controller = "Home", action = "Index", id = UrlParameter.Optional }
        );
    }
}

In this example:

• The IgnoreRoute method is used to exclude specific routes from being processed by MVC.
• The MapRoute method defines a default route named "Default."
• The URL pattern {controller}/{action}/{id} specifies the structure of the URL. It expects a controller name, an action name, and an optional ID parameter.
• The defaults parameter specifies the default values if any of the URL segments are missing. In this case, if no controller or action is provided, it defaults to the "Home" controller and the "Index" action.

You can define multiple routes to handle different URL patterns and customize the routing behavior as per your application's requirements.

Filters in ASP.NET MVC

Filters in ASP.NET MVC allow you to add cross-cutting concerns to your application. They are attributes that can be applied to controllers or actions and are executed at specific stages during the processing of a request.

There are several types of filters available in ASP.NET MVC, including:

• Authorization Filters: These filters control access to actions or controllers based on user roles, authentication status, or other criteria.

• Action Filters: These filters execute before and after an action method is executed. They can modify the behavior of the action or perform additional processing.

• Result Filters: These filters execute before and after the execution of a result (the data returned by an action). They can modify the result or perform additional processing.

• Exception Filters: These filters handle exceptions that occur during the processing of a request. They can log the exception, display a custom error page, or perform other error handling tasks.

By applying filters to controllers or actions, you can easily add behavior to your application without duplicating code across multiple actions.

ActionFilter Attributes

ActionFilter attributes in ASP.NET MVC allow you to apply specific behavior to controller actions. They are derived from the ActionFilterAttribute base class and can be applied to individual actions or entire controllers.

Here's an example of using an ActionFilter attribute:

csharp
public class LogActionAttribute : ActionFilterAttribute
{
    public override void OnActionExecuting(ActionExecutingContext filterContext)
    {
        // Code to execute before the action method is called
        Log("Action started");
    }

    public override void OnActionExecuted(ActionExecutedContext filterContext)
    {
        // Code to execute after the action method is called
        Log("Action completed");
    }

    private void Log(string message)
    {
        // Code to log the message
        Console.WriteLine(message);
    }
}

In this example, the LogActionAttribute is an ActionFilter attribute that logs a message before and after the action method is executed. You can apply this attribute to any action or controller to add logging functionality.

To apply the ActionFilter attribute, you can use the [LogAction] attribute syntax:

csharp
[LogAction]
public ActionResult Index()
{
    // Action method code
    return View();
}

When the Index action is called, the LogActionAttribute's OnActionExecuting method will be called before the action, and the OnActionExecuted method will be called after the action.

You can create custom ActionFilter attributes to add various behaviors like logging, caching, validation, and more to your controller actions.

What is Bundling in ASP.NET MVC?

Bundling in ASP.NET MVC is a feature that combines multiple JavaScript or CSS files into a single file, reducing the number of HTTP requests made by the browser. It helps improve the performance of web applications by minimizing the download time for static resources.

Bundling is typically configured in the BundleConfig.cs file in the App_Start folder. Here's an example of bundling JavaScript files:

csharp
public class BundleConfig
{
    public static void RegisterBundles(BundleCollection bundles)
    {
        bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
                    "~/Scripts/jquery-{version}.js"));

        bundles.Add(new ScriptBundle("~/bundles/bootstrap").Include(
                  "~/Scripts/bootstrap.js",
                  "~/Scripts/bootstrap-datepicker.js"));

        // Other bundles can be added here

        // Enable bundle optimization in release mode
        BundleTable.EnableOptimizations = true;
    }
}

In this example, two bundles are defined: one for jQuery and one for Bootstrap and its dependencies. The bundles use the ScriptBundle class and specify the files to include using the Include method.

To use the bundled files in a View, you can use the Scripts.Render helper:

html
@Scripts.Render("~/bundles/jquery")
@Scripts.Render("~/bundles/bootstrap")

When the View is rendered, the helper will generate a single <script> tag that includes the bundled JavaScript files.

Bundling can also be done for CSS files using the StyleBundle class and the Styles.Render helper.

ScriptBundle

The ScriptBundle class in ASP.NET MVC is used to bundle JavaScript files into a single file. It allows you to combine multiple JavaScript files into one HTTP request, reducing the overhead of multiple requests.

Here's an example of using the ScriptBundle class:

csharp
bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
    "~/Scripts/jquery-{version}.js",
    "~/Scripts/jquery.validate.js",
    "~/Scripts/jquery.validate.unobtrusive.js"
));

In this example, a ScriptBundle named "jquery" is created with three JavaScript files: jQuery, jQuery Validate, and jQuery Unobtrusive Validation. When the bundle is rendered in a View, the framework combines these files into a single request.

StyleBundle

The StyleBundle class in ASP.NET MVC is used to bundle CSS files into a single file. It allows you to combine multiple CSS files into one HTTP request, reducing the number of requests made by the browser.

Here's an example of using the StyleBundle class:

csharp
bundles.Add(new StyleBundle("~/bundles/css").Include(
    "~/Content/site.css",
    "~/Content/bootstrap.css"
));

In this example, a StyleBundle named "css" is created with two CSS files: site.css and bootstrap.css. When the bundle is rendered in a View, the framework combines these files into a single request.

Using the StyleBundle class helps improve the performance of your web application by reducing the number of round trips made to the server to fetch individual CSS files.

Area in ASP.NET MVC

Areas in ASP.NET MVC allow you to partition your application into distinct sections or modules. Each area can have its own controllers, models, views, and other supporting files.

To create an area in an MVC application, follow these steps:

1. Right-click on the project in Visual Studio and select "Add" > "Area."
2. Enter a name for the area (e.g., "Admin") and click "Add."
3. Visual Studio will generate a folder structure for the area, including Controllers, Models, and Views folders specific to the area.
4. Add controllers, models, and views to the area as needed.

By using areas, you can logically separate different parts of your application and organize the codebase more effectively. Each area can have its own routing configuration and can be treated as a self-contained module within the application.

ASP.NET MVC Learning Resources

Here are some learning resources for ASP.NET MVC:

1. Microsoft Documentation: The official Microsoft documentation provides detailed information, tutorials, and examples on ASP.NET MVC. You can find it at https://docs.microsoft.com/en-us/aspnet/mvc/.

2. Pluralsight: Pluralsight offers a variety of video courses on ASP.NET MVC, ranging from beginner to advanced topics. Visit https://www.pluralsight.com for more information.

3. Udemy: Udemy has numerous online courses on ASP.NET MVC for different skill levels. You can explore the available courses at https://www.udemy.com and choose the one that suits your needs.

4. Stack Overflow: Stack Overflow is a popular online community where developers can ask questions and get answers related to ASP.NET MVC. It can be a valuable resource for troubleshooting and finding solutions to specific problems. Visit https://stackoverflow.com and search for relevant tags or ask your own questions.

5. Books: There are several books available on ASP.NET MVC that provide in-depth coverage of the framework. Some recommended titles include "Pro ASP.NET MVC" by Adam Freeman and "ASP.NET MVC 5" by Jon Galloway, Brad Wilson, and K. Scott Allen.

Remember that practical hands-on experience is crucial for mastering ASP.NET MVC. Try building small projects, explore sample applications, and continuously practice and experiment with the framework to deepen your understanding.