Many of you had worked on some tutorial web-app projects. You followed all the instructions, created some folders, wrote the code, and ran the program. But have you wondered why they put codes like that and what’s the logic behind the process? Today, I will introduce you to a concept called MVC.
Model–view–controller is a software design pattern commonly used for developing user interfaces that divide the related program logic into three interconnected elements.
Model: Handles data logic. View: It displays the information from the model to the user. Controller: It controls the data flow into a model object and updates the view whenever data changes.
Model
It is responsible for dealing with data. The model is connected to the database. The model responds to the controller’s requests because the controller never talks to the database directly. The model talks to the database back and forth and then gives the requested data to the controller. Adding, updating, deleting, or retrieving data is done in the model component.
View
The view defines how the app’s data should be displayed. In web applications, the view component is the HTML/CSS part. The controller passes the data received from the model to the view. The view displays the data to end-users throughout the web pages.
Controller
The controller is the main. It enables the interaction between the view and the model. The view and the controller don’t save any data. The view sends the input to the controller. And the controller has no responsibility to save these data. It just hands data to the Model and lets it deal with the data. If the view requests some data, the controller tells the model to get the data and sends the data back to the view. The controller is the intermediator between the view and the model.
If you have done some web apps, this pattern will probably be quite familiar even if you’ve never consciously used it before. For instance, your data model is probably contained in some kind of database (MariaDB, MongoDB, etc.). You probably wrote your app’s controller using Express(node.js) or Flask(python). And the user interface is probably written using REACT/HTML/CSS/whatever else you like.
MVC is an architecture that divides your software into smaller components. This means components are reusable. Different components of the application in MVC can be independently deployed and maintained. If you want to scale up your app in the future, when designing the architecture, MVC can be one of your choices.
