MVC (Model-View-Controller)
Tags: programming, java, design, tutorial
Published: 2022-05-05 16:30:08

**Introduction:**
The Model-View-Controller (MVC) is an architectural pattern that separates an application into three main logical components: the model, the view, and the controller. Each of these components is built to handle specific development aspects of an application. MVC is one of the most frequently used industry-standard web development frameworks to create scalable and extensible projects.

**MVC Architecture:**

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/pgdpzokf51zogaibwu5o.png)

**Model:**
The Model component corresponds to all the data-related logic that the user works with. This can represent either the data that is being transferred between the View and Controller components or any other business logic-related data. For example, a Customer object will retrieve the customer information from the database, manipulate it and update it data back to the database or use it to render data.

**View:**
The View component is used for all the UI logic of the application. For example, the Customer view will include all the UI components such as text boxes, dropdowns, etc. that the final user interacts with.

**Controller:** 
Controllers act as an interface between Model and View components to process all the business logic and incoming requests, manipulate data using the Model component and interact with the Views to render the final output. For example, the Customer controller will handle all the interactions and inputs from the Customer View and update the database using the Customer Model. The same controller will be used to view the Customer data.

In Java Programming, the Model contains the simple Java classes, the View used to display the data and the Controller contains the servlets. Due to this separation, the user requests are processed as follows:

- A client (browser) sends a request to the controller on the server-side, for a page.
- The controller then calls the model. It gathers the requested data.
- Then the controller transfers the data retrieved to the view layer.
- Now the result is sent back to the browser (client) by the view.

**Advantages of MVC Architecture:**

1. Faster Development Process
2. Ability To Provide Multiple Views
3. The Modification Does Not Affect The Entire Model
4. MVC Model Returns The Data Without Formatting
5. SEO Friendly Development Platform
6. MVC has the feature of scalability that in turn helps the growth of the application.
7. The components are easy to maintain because there is less dependency.
8. A model can be reused by multiple views that provide the reusability of code.
9. The developers can work with the three layers (Model, View, and Controller) simultaneously.
10. Using MVC, each layer is maintained separately therefore we do not require to deal with massive code.
11. The extending and testing of applications is easier.

**Disadvantages of MVC Architecture:**

1. Complexity
2. Cost of Frequent Updates

**MVC on the Web-based Applications**
As a web developer, this pattern will probably be quite familiar even if you've never consciously used it before. Your data model is probably contained in some kind of database.Your app's controlling code is probably written in HTML/JavaScript, and your user interface is probably written using HTML/CSS/whatever else you like. This sounds very much like MVC, but MVC makes these components follow a more rigid pattern.
In the early days of the Web, MVC architecture was mostly implemented on the server-side, with the client requesting updates via forms or links, and receiving updated views back to display in the browser. However, these days, more of the logic is pushed to the client with the advent of client-side data stores, and `XMLHttpRequest` allowing partial page updates as required.
Web frameworks such as Spring MVC, AngularJS, and React.js all implement an MVC architecture.

**MVC Flow Diagram:**

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/m8y1tafvl7otr3qy6dyo.jpg)

**Flow Steps**
Step 1 − The client browser sends requests to the MVC Application.
Step 2 − Global receives this request and performs routing based on the URL 
Step 3 − This routing operation calls the appropriate controller and executes it 
Step 4 − The Controller processes the data using the Model and invokes the appropriate method 
Step 5 − The processed Model is then passed to the View, which in turn renders the final output.

**Conclusion**

The MVC pattern has many advantages by separation of input logic, business logic and UI logic and on the other hand it also increases the development speed, easy to understand and test the bugs and error. It completely segregates the different layers of software architecture such as the Model Layer, View Layer, and Controller Layer.
It increases the readability of the code but on the other hand, it has some drawbacks such as framework navigation can be complex because it introduces new layers of abstraction and requires users to adapt to the decomposition criteria of MVC. and Knowledge on multiple technologies becomes the norm. Developers using MVC need to be skilled in multiple technologies.