Architectural Pattern - MVC (Model-View-Controller)
Tags: mobile, designpatterns, architecturalpattern, tutorial
Published: 2024-02-06 13:59:22

The MVC pattern suggests splitting the code into 3 components. While creating the class/file of the application, the developer must categorise it into one of the following three layers:

**Model:** This component stores the application data. It has no knowledge about the interface. The model is responsible for handling the domain logic(real-world business rules) and communication with the database and network layers.

**View:** It is the UI(User Interface) layer that holds components that are visible on the screen. Moreover, it provides the visualisation of the data stored in the Model and offers interaction to the user.

**Controller:** This component establishes the relationship between the View and the Model. It contains the core application logic and gets informed of the user’s behaviour and updates the Model as per the need.


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

Here's a simple example of MVC (Model-View-Controller) architecture implemented in Swift:

**Model**

```
struct Person {
    var name: String
    var age: Int
}
```

**View**

```
import UIKit

class PersonView: UIView {
    private let nameLabel = UILabel()
    private let ageLabel = UILabel()
    
    override init(frame: CGRect) {
        super.init(frame: frame)
        
        setupSubviews()
    }
    
    required init?(coder aDecoder: NSCoder) {
        fatalError("init(coder:) has not been implemented")
    }
    
    private func setupSubviews() {
        nameLabel.frame = CGRect(x: 20, y: 20, width: 200, height: 30)
        addSubview(nameLabel)
        
        ageLabel.frame = CGRect(x: 20, y: 60, width: 200, height: 30)
        addSubview(ageLabel)
    }
    
    func configure(with person: Person) {
        nameLabel.text = "Name: \(person.name)"
        ageLabel.text = "Age: \(person.age)"
    }
}
```


**Controller**

```
import UIKit

class PersonViewController: UIViewController {
    private var person: Person
    private var personView: PersonView!

    init(person: Person) {
        self.person = person
        super.init(nibName: nil, bundle: nil)
    }
    
    required init?(coder aDecoder: NSCoder) {
        fatalError("init(coder:) has not been implemented")
    }

    override func viewDidLoad() {
        super.viewDidLoad()

        title = "Person Details"
        
        personView = PersonView(frame: view.bounds)
        view.addSubview(personView)
        
        personView.configure(with: person)
    }
}
```

**Usage**


```
let person = Person(name: "John", age: 30)
let personViewController = PersonViewController(person: person)

```

In this example:

Person represents the model with properties like name and age.

PersonView is the view that displays the information of a Person. It's a UIView subclass that contains two UILabels for displaying the name and age of a person.

PersonViewController is the controller that manages interactions between the model (Person) and the view (PersonView). It sets up the PersonView and configures it with the data from the Person model.

Usage section demonstrates how to create a Person instance and a PersonViewController instance with that Person object.

Here are some advantages and disadvantages of using the MVC (Model-View-Controller) architectural pattern in software development:

#### Advantages:

Separation of Concerns: MVC separates the application logic into three interconnected components, each responsible for a specific aspect of the application: Model (data and business logic), View (user interface), and Controller (input handling and application logic). This separation makes the codebase more organized and maintainable.
	
Modularity and Reusability: With MVC, each component can be developed and tested independently, promoting modularity and reusability. For example, you can reuse the same model with different views or controllers, or vice versa.
	
Easier to Maintain: Because of the clear separation of concerns, it's easier to maintain and update each component without affecting the others. Developers can make changes to the view layer without touching the model or controller, and vice versa.

Parallel Development: MVC allows multiple developers to work simultaneously on different components of the application, as long as they adhere to the defined interfaces. This parallel development can speed up the development process.

Compatibility with GUI frameworks: MVC aligns well with GUI frameworks that support event-driven programming, making it a natural choice for developing user interface applications.

#### Disadvantages:

Complexity: MVC, especially in its original form, can introduce complexity, especially in large applications. Maintaining the relationships between models, views, and controllers can become challenging, leading to spaghetti code if not properly managed.

Tight Coupling: In traditional MVC, views and controllers can become tightly coupled, which can make the codebase less flexible and harder to refactor. Changes in one component may require corresponding changes in other components.
	
Difficulty in Testing: Traditional MVC architectures may make it difficult to write unit tests because of the tight coupling between components. Testing individual components in isolation can be challenging, leading to more integration tests.

Overhead: MVC can introduce some overhead due to the need for additional layers and communication between them. In simpler applications, this overhead may not be justified.
	
Potential for Massive View Controller: In iOS development using UIKit, for example, the view controller tends to become massive, taking on responsibilities beyond its intended scope. This can lead to code that is hard to understand and maintain.

Overall, while MVC offers clear benefits in terms of separation of concerns and modularity, it's essential to carefully manage its complexities to avoid common pitfalls such as tight coupling and code bloat.


[MVP](https://dev.to/binoy123/architectural-pattern-model-view-presenter-mvp-28hl) [VIP](https://dev.to/binoy123/architectural-pattern-vip-view-interactor-presenter-6hf) [MVVM](https://dev.to/binoy123/architectural-pattern-mvvm-model-view-viewmodel-2jaa)