Getting Started With ASP.NET Core MVC: A Step-by-Step Beginner Guide (Part 1/8)

Getting Started With ASP.NET Core MVC: A Step-by-Step Beginner Guide

ASP.NET Core MVC is a powerful framework for building modern, secure, and high-performance web applications. If you are new to ASP.NET Core, this guide walks through the fundamentals of Controllers, Models, and Views, followed by a simple CRUD (Create, Read, Update, Delete) example.

What Is ASP.NET Core MVC?

ASP.NET Core MVC follows the Model–View–Controller (MVC) design pattern:

Model → Represents application data and business logic
View → Displays the UI
Controller → Handles requests and returns responses

This separation of concerns makes applications easier to test, maintain, and scale.

Setting Up a New ASP.NET Core MVC Project

Step 1 — Create a New Project

In Visual Studio:

Create a new project
Select ASP.NET Core Web App (Model-View-Controller)

Step 2 — Choose Project Options

Select the following options:

Framework: .NET 8 (recommended)
Authentication: None
Configure for HTTPS: Enabled
Enable Docker: Disabled (for now)

Your base MVC project structure is now ready.

Understanding the Project Structure

Key folders used in an MVC project:

Controllers/
Contains controller classes such as HomeController.cs
Models/
Contains data and domain classes (e.g., Product, User)
Views/
Contains .cshtml files grouped by controller name
wwwroot/
Stores static files such as CSS, JavaScript, and images

Creating a Simple CRUD Example — Product Management

This example demonstrates a basic product management module.

Product Fields

Id (int)
Name (string)
Price (decimal)

Step-by-Step Implementation

Step 1 — Create the Model

File: Models/Product.cs

namespace MVCApp.Models
{
    public class Product
    {
        public int Id { get; set; }
        public string Name { get; set; }
        public decimal Price { get; set; }
    }
}

Step 2 — Create an In-Memory Repository

This example uses an in-memory list instead of a database.

File: Data/ProductRepository.cs

using MVCApp.Models;

namespace MVCApp.Data
{
    public static class ProductRepository
    {
        private static List<Product> _products = new List<Product>()
        {
            new Product { Id = 1, Name = "Keyboard", Price = 1200 },
            new Product { Id = 2, Name = "Mouse", Price = 600 }
        };

        public static List<Product> GetAll() => _products;

        public static Product? Get(int id) =>
            _products.FirstOrDefault(p => p.Id == id);

        public static void Add(Product product)
        {
            product.Id = _products.Max(p => p.Id) + 1;
            _products.Add(product);
        }

        public static void Update(Product updatedProduct)
        {
            var existing = Get(updatedProduct.Id);
            if (existing != null)
            {
                existing.Name = updatedProduct.Name;
                existing.Price = updatedProduct.Price;
            }
        }

        public static void Delete(int id)
        {
            var product = Get(id);
            if (product != null)
                _products.Remove(product);
        }
    }
}

Step 3 — Create the Controller

File: Controllers/ProductController.cs

using Microsoft.AspNetCore.Mvc;
using MVCApp.Data;
using MVCApp.Models;

namespace MVCApp.Controllers
{
    public class ProductController : Controller
    {
        public IActionResult Index()
        {
            var products = ProductRepository.GetAll();
            return View(products);
        }

        public IActionResult Create()
        {
            return View();
        }

        [HttpPost]
        public IActionResult Create(Product product)
        {
            ProductRepository.Add(product);
            return RedirectToAction("Index");
        }

        public IActionResult Edit(int id)
        {
            var product = ProductRepository.Get(id);
            return View(product);
        }

        [HttpPost]
        public IActionResult Edit(Product product)
        {
            ProductRepository.Update(product);
            return RedirectToAction("Index");
        }

        public IActionResult Delete(int id)
        {
            ProductRepository.Delete(id);
            return RedirectToAction("Index");
        }
    }
}

Creating Views

Index View — List Products

File: Views/Product/Index.cshtml

@model List<MVCApp.Models.Product>

<h2>Product List</h2>

<a href="/Product/Create" class="btn btn-primary">Add New</a>

<table class="table">
    <thead>
        <tr>
            <th>Id</th>
            <th>Name</th>
            <th>Price</th>
            <th>Actions</th>
        </tr>
    </thead>
    <tbody>
        @foreach (var p in Model)
        {
            <tr>
                <td>@p.Id</td>
                <td>@p.Name</td>
                <td>@p.Price</td>
                <td>
                    <a href="/Product/Edit/@p.Id">Edit</a> |
                    <a href="/Product/Delete/@p.Id">Delete</a>
                </td>
            </tr>
        }
    </tbody>
</table>

Create View

File: Views/Product/Create.cshtml

@model MVCApp.Models.Product

<h2>Add New Product</h2>

<form asp-action="Create" method="post">
    <label>Name:</label>
    <input type="text" name="Name" class="form-control" />

    <label>Price:</label>
    <input type="number" step="0.01" name="Price" class="form-control" />

    <br />
    <button type="submit" class="btn btn-success">Save</button>
</form>

Edit View

File: Views/Product/Edit.cshtml

@model MVCApp.Models.Product

<h2>Edit Product</h2>

<form asp-action="Edit" method="post">
    <input type="hidden" asp-for="Id" />

    <label>Name:</label>
    <input asp-for="Name" class="form-control" />

    <label>Price:</label>
    <input asp-for="Price" class="form-control" />

    <br />
    <button type="submit" class="btn btn-primary">Update</button>
</form>

Running the Application

Navigate to:

/Product

You now have a working CRUD module that supports:

Creating products
Editing products
Deleting products
Listing all products

This workflow reflects the standard approach used in real-world ASP.NET Core MVC applications.