Create Your First ASP.NET Core MVC App

This tutorial guides you through building a basic web application using the Model-View-Controller (MVC) pattern in ASP.NET Core.

Prerequisites

Before you begin, ensure you have the following installed:

• .NET SDK (latest version recommended)
• Visual Studio or Visual Studio Code with the C# extension

Step 1: Create a New Project

Open your terminal or command prompt and run the following command to create a new ASP.NET Core MVC project:

dotnet new mvc -o MyMovieApp

This will create a new directory named MyMovieApp and generate the project files within it.

Step 2: Explore the Project Structure

Navigate into the newly created project directory:

cd MyMovieApp

You'll find a standard MVC project structure:

• Controllers: Contains classes that handle incoming requests and return responses.
• Models: Represents the data of your application.
• Views: Contains the UI elements (HTML, CSS, JavaScript) that are rendered to the user.
• wwwroot: Holds static files like CSS, JavaScript, and images.
• Program.cs: The entry point of your application.
• Startup.cs (or minimal APIs configuration in Program.cs): Configures application services and the request pipeline.

Step 3: Run the Application

To see your application in action, run:

dotnet run

This will start a local web server, and you can access your application by navigating to the provided URL (usually https://localhost:5001 or http://localhost:5000) in your web browser.

Step 4: Understanding the MVC Pattern

The MVC pattern separates an application into three interconnected parts:

• Model: Represents the application's data and business logic.
• View: Renders the user interface (UI) and displays data from the Model.
• Controller: Handles user input, interacts with the Model, and selects a View to render.

Example: The HomeController

Open Controllers/HomeController.cs. You'll see methods like Index and Privacy which act as action methods. When a user requests a specific URL, the corresponding action method in the controller is executed.

Example: The Index.cshtml View

The associated view for the Index action is Views/Home/Index.cshtml. This file contains HTML markup mixed with Razor syntax (@) for dynamic content generation.

Step 5: Adding a New Page

Let's add a simple "About" page:

1. Create a new Controller Action: In Controllers/HomeController.cs, add a new method:

   public IActionResult About()
   {
       ViewData["Message"] = "Your application description page.";
       return View();
   }

2. Create the corresponding View: Create a new file named About.cshtml in the Views/Home directory with the following content:

   <h1>About</h1>
   <h3>@ViewData["Message"]</h3>
   
   <p>This is a simple ASP.NET Core MVC application tutorial.</p>

Now, when you run the application and navigate to /Home/About, you should see your new "About" page.

Conclusion

You've successfully created and explored your first ASP.NET Core MVC application. This tutorial covered project creation, understanding the MVC pattern, and adding new content. Continue exploring the ASP.NET Core documentation to learn about advanced topics like data binding, validation, and more.