Introduction to ASP.NET Core MVC

Welcome to the ASP.NET Core MVC tutorial. This guide will introduce you to the core concepts of building web applications using the Model-View-Controller (MVC) pattern with ASP.NET Core.

What is MVC?

The Model-View-Controller (MVC) architectural pattern separates an application into three interconnected components:

• Model: Represents the data and the business logic of the application. It's responsible for managing data, responding to requests for data, and updating data when instructed by the Controller.
• View: Responsible for presenting data to the user. It's typically a user interface (UI) that displays the information obtained from the Model. Views are often HTML pages with embedded logic to dynamically generate content.
• Controller: Acts as an intermediary between the Model and the View. It receives user input, processes it (often by interacting with the Model), and then selects a View to render the output.

Why use ASP.NET Core MVC?

ASP.NET Core MVC offers several advantages for web development:

• Separation of Concerns: The MVC pattern promotes a clear separation of concerns, making your codebase more organized, maintainable, and testable.
• Extensibility: ASP.NET Core is built with extensibility in mind, allowing you to customize and integrate various components easily.
• Performance: ASP.NET Core is designed for high performance and efficiency.
• Cross-Platform: You can develop and run ASP.NET Core applications on Windows, macOS, and Linux.

Project Setup

Let's start by creating a new ASP.NET Core MVC project. You can use Visual Studio, Visual Studio Code, or the .NET CLI.

Using the .NET CLI

Open your terminal or command prompt and run the following commands:

dotnet new mvc -o MyMvcApp
cd MyMvcApp

This will create a new directory named MyMvcApp with a basic MVC project structure.

Exploring the Project Structure

Inside your project, you'll find several important folders:

• Controllers: Contains your controller classes.
• Models: Contains your model classes (data structures and business logic).
• Views: Contains your view files (Razor files for UI).
• wwwroot: Contains static files like CSS, JavaScript, and images.
• Program.cs: The entry point of your application.

The Request Lifecycle

When a user requests a page in an MVC application, the following happens:

1. The browser sends an HTTP request to the server.
2. The ASP.NET Core framework routes the request to the appropriate controller action.
3. The controller action executes, potentially interacting with the Model to retrieve or manipulate data.
4. The controller selects a View to render the response.
5. The View uses the data from the Model (if any) to generate an HTML response.
6. The server sends the HTML response back to the browser.

Example: Default Route

By default, ASP.NET Core MVC uses a convention-based routing system. A URL like /Home/Index maps to the Index action method in the HomeController.

You can view the default routing configuration in Program.cs (or Startup.cs in older versions):

app.MapControllerRoute(
    name: "default",
    pattern: "{controller=Home}/{action=Index}/{id?}");

Creating Your First Controller and View

Let's create a simple controller named GreetingController and a corresponding view.

1. Create the Controller

In the Controllers folder, create a new C# file named GreetingController.cs:

using Microsoft.AspNetCore.Mvc;

            namespace MyMvcApp.Controllers
            {
                public class GreetingController : Controller
                {
                    public IActionResult Index()
                    {
                        ViewBag.Message = "Hello from the Greeting Controller!";
                        return View();
                    }

                    public IActionResult SayHello(string name)
                    {
                        if (string.IsNullOrEmpty(name))
                        {
                            name = "Guest";
                        }
                        ViewData["UserName"] = name;
                        return View();
                    }
                }
            }

2. Create the Views

In the Views folder, create a new folder named Greeting. Inside this folder, create two Razor files:

Views/Greeting/Index.cshtml

@{
                ViewData["Title"] = "Greeting Index";
            }

            
@ViewBag.Message
            
This is the index page for the Greeting controller.
            
Try visiting /Greeting/SayHello/Alice or /Greeting/SayHello.

Views/Greeting/SayHello.cshtml

@{
                ViewData["Title"] = "Say Hello";
            }

            
Hello, @ViewData["UserName"]!
            
Welcome to our greeting page.

Running the Application

To run your application, navigate to your project directory in the terminal and execute:

dotnet run

Then, open your web browser and go to https://localhost:5001/Greeting/Index (or the appropriate URL provided by the CLI). You can also try https://localhost:5001/Greeting/SayHello/World.

This introduction provides a foundational understanding of ASP.NET Core MVC. Continue exploring the documentation to learn more about routing, models, views, data binding, and more advanced topics.