MVC Architecture

Sujani Thuthilochana
5 min readJun 10, 2021

MVC is standard for Model-View-Controller. This MVC architecture is the most popular and widely used software architecture.

What is Software Architecture?

“Software architecture is the foundation of a software system. Like other types of engineering, the foundation has a profound effect on the quality of what is built on top of it. As such, it holds a great deal of importance in terms of the successful development, and eventual maintenance, of the system.”

Excerpt From: Joseph Ingeno. “Software Architect’s Handbook.” Apple Books.

Examples of software architectures commonly used in the IT industry:

  1. Layered pattern
  2. Client-server pattern
  3. Master-slave pattern
  4. Pipe-filter pattern
  5. Broker pattern
  6. Peer-to-peer pattern
  7. Event-bus pattern
  8. Model-view-controller pattern
  9. Blackboard pattern
  10. Interpreter pattern

As I said in the beginning, out of these software architectures the MVC architecture has won a considerable place and it can be identified as the most popular and widely used software architecture.

MVC Architecture

MVC architecture does not belong to any specific programming language or framework, but the MVC model is widely used for a web application development purpose for the ASP.net platform. Therefore today organizations are looking for the .net development of web applications based on MVC architecture.

Why MVC architecture is this popular?

· It has a faster development process.

· It can provide multiple views.

· Easier to update the application.

· The modification never affects the entire model.

· Easy for multiple developers to collaborate and work together.

· It can return data without formatting.

· It is an SEO friendly development platform

How Does MVC Pattern Work?

MVC has three levels as Model, View, and Controller. Let’s understand the MVC architecture supported in ASP.NET, discussing these three levels.

MVC Architecture

The Model

The model is the place where all the data related logic like schemas and interfaces of a project, the databases and their fields are available. It represents the data to the user. This level defines where the application’s data objects are stored.

If we want to render a list of images, we have to retrieve them from the media files related record/model in the database.

The below image depicts that how a project can contain model files.

Model files in a project

The View

The view contains the UI of an application. It is the visual representation of the MVC model and creates an interface to show the actual output to the user.

The below image depicts that how a project can contain view files. There are lots of views under several folders. These views are for the UI rendering of the project. If we want to display an image, the related HTML code for displaying an image is available here.

View files in a project

The Controller

The controller is a level that acts as the brain of the entire MVC system. The controller contains business-related logic and it handles the incoming requests. Actually, the controller is the interface between view and model.

The below image depicts that how a project can contain controller files. If we want to display an image, the request of gathering data and the request of displaying that received data will be handled by these controllers.

Controller files in a project

Ok, now you know the definitions for View, Model and Controller. Let’s discuss how these three are interconnected and working together. To get this procedure well, put a great look at the below image.

How Does MVC Pattern Work

Step 01: User requests from the browser to display student details like a table and this request is caught by the controller. Let’s assume that the controller name is Student_controller.

Step 02: The Controller(Student_controller ) passes a request of gathering data, to a related model which contains the student data in the database. Here let’s assume that the model class name is Student model.

Step 03: The Student model finds the data for each student from the database and sends these data to the Student_controller again.

Step 04: The Student_controller sends a request to the view, asking to render those data. Here let's assume this view name is studentData view and it has HTML tags to display data as a table.

Step 05: The studentData view sends the data-list as a table with relevant styles(CSS) to the Student_controller again.

Step 06: Now the Student_controller has the final output. But still, users can not see it. So the Student_controller returns that configured data list, back to the browser.

Step 07: When the browser received relevant data that the user requested, it will render in the browser and now the user can see them.

Hope you will get a clear picture of how the MVC architecture works and note that this is the simplest explanation for MVC. This MVC architecture separates the input, processing, and output of an application and that’s why most developers widely use this architecture for their projects. MVC reduces the code complexity and makes the software easily understandable. Even though this is very popular, it does have some disadvantages, the main one is the complexity of understanding the procedure of this architecture.

Thank you for reading my article!

--

--