MVC basics
- What you’ll build

MVC basics

In this chapter, you’ll explore the MVC system in ASP.NET Core. MVC (Model-View-Controller) is a pattern for building web applications that’s used in almost every web framework (Ruby on Rails and Express are popular examples), as well as frontend JavaScript frameworks like Angular. Mobile apps on iOS and Android use a variation of MVC as well.

As the name suggests, MVC has three components: models, views, and controllers. Controllers handle incoming requests from a client or web browser and make decisions about what code to run. Views are templates (usually HTML plus some templating language like Handlebars, Pug, or Razor) that get data added to them and then are displayed to the user. Models hold the data that is added to views, or data that is entered by the user.

A common pattern for MVC code is:

The controller receives a request and looks up some information in a database
The controller creates a model with the information and attaches it to a view
The view is rendered and displayed in the user’s browser
The user clicks a button or submits a form, which sends a new request to the controller

If you’ve worked with MVC in other languages, you’ll feel right at home in ASP.NET Core MVC. If you’re new to MVC, this chapter will teach you the basics and will help get you started.

What you’ll build

The “Hello World” exercise of MVC is building a to-do list application. It’s a great project since it’s small and simple in scope, but it touches each part of MVC and covers many of the concepts you’d use in a larger application.

In this book, you’ll build a to-do app that lets the user add items to their to-do list and check them off once complete. You’ll build the server (the “backend”) using ASP.NET Core, C#, and the MVC pattern. You’ll use HTML, CSS, and JavaScript in the views (also called the “frontend”).

If you haven’t already created a new ASP.NET Core project using dotnet new mvc, follow the steps in the previous chapter. You should be able to build and run the project and see the default welcome screen.