MVC (Model-View-Controller) 패턴

오늘은 MVC 패턴에 대해서 정리해보겠습니다.

출처: https://www.freecodecamp.org/news/the-model-view-controller-pattern-mvc-architecture-and-frameworks-explained/

MVC (Model-View-Controller) 패턴이란?

MVC (Model-View-Controller) 패턴은 컴퓨터공학에서 소프트웨어 설계와 아키텍처를 위한 디자인 패턴 중 하나입니다. 이 패턴은 주로 사용자 인터페이스(UI)를 가진 응용 프로그램에 사용되며, 애플리케이션의 개발과 유지 보수를 쉽게 하기 위해 데이터, 프레젠테이션, 프로세싱을 서로 분리합니다.

MVC 패턴의 세 가지 주요 구성 요소는 다음과 같습니다:

모델(Model)

 

모델은 애플리케이션의 핵심 데이터와 비즈니스 로직을 나타냅니다. 데이터 저장소와의 상호 작용, 데이터 처리 및 유

효성 검사와 같은 작업을 수행합니다. 모델은 독립적으로 작동하며, 뷰와 컨트롤러와 직접적으로 통신하지 않습니다.

뷰(View)

뷰는 사용자에게 보여지는 애플리케이션의 UI 부분입니다. 뷰는 1) 모델에서 데이터를 받아 사용자에게 표시하고, 사용자의 2) 입력을 컨트롤러에 전달합니다. 뷰는 애플리케이션의 데이터 표시와 관련된 모든 작업을 처리합니다.

컨트롤러(Controller)

컨트롤러는 사용자 입력을 처리하고, 애플리케이션의 흐름을 관리합니다. 뷰에서 전달된 사용자 입력을 분석하고, 적절한 모델 기능을 호출하여 데이터를 조작하거나 업데이트합니다. 그런 다음 결과를 다시 뷰에 전달하여 화면에 표시할 수 있습니다.

 

 

M-V-C의 상호작용

MVC 패턴의 세 가지 구성 요소는 상호 작용을 하며,  상호작용시 각 요소는 명확하게 정의된 역할을 수행합니다.

사용자가 애플리케이션에서 작업을 수행하면, 뷰(View)는 사용자의 입력을 감지하고 컨트롤러(Controller)에 전달합니다.
컨트롤러는 사용자 입력을 처리하고 적절한 모델(Model) 기능을 호출하여 데이터를 검색, 수정 또는 저장합니다.
모델은 데이터와 관련된 비즈니스 로직을 수행하고, 필요한 경우 데이터베이스와 상호 작용합니다. 모델은 작업이 완료되면 결과를 컨트롤러에 반환합니다.
컨트롤러는 모델의 결과를 받아 뷰에 전달합니다. 뷰는 이 데이터를 사용하여 사용자에게 보여지는 화면을 업데이트합니다.

 

MVC패턴의 설계원칙

MVC 패턴 설계시 지켜야 할 원칙 아래와 같습니다.

1. 각 구성 요소의 역할과 책임을 명확하게 구분

모델, 뷰, 컨트롤러는 독립적으로 작동하고, 각각의 역할에 집중해야 합니다.

• 모델(Model): 데이터와 비즈니스 로직을 처리합니다. 데이터의 저장, 검색, 수정 등에 집중하며, 뷰와 컨트롤러에 대한 정보는 가지고 있지 않습니다.
• 뷰(View): 사용자 인터페이스를 담당하며, 모델에서 전달받은 데이터를 화면에 표시합니다. 뷰는 사용자의 입력을 받아 컨트롤러에 전달하고, 데이터 표시에만 집중합니다.
• 컨트롤러(Controller): 사용자 입력을 받아 모델과 뷰 사이에서 통신을 관리합니다. 사용자의 요청을 해석하고, 적절한 모델 함수를 호출하여 데이터를 처리한 후 결과를 뷰에 전달합니다.

2. 구성 요소간의 결합도 최소화

결합도 최소화를 위해 구성 요소간의 직접적인 참조를 피하고, 

각 구성 요소는 다른 구성 요소와의 의존성을 최소화해야 합니다. 이를 통해 구성 요소를 독립적으로 개발, 수정, 테스트할 수 있습니다.
이벤트 기반 통신, 옵저버 패턴, 인터페이스를 통한 의존성 주입 등을 사용하여 구성 요소 간의 결합도를 낮출 수 있습니다.

 

 

3. 코드의 재사용성과 확장성 고려

각 구성 요소는 독립적이고 재사용 가능한 모듈로 개발되어야 합니다. 이를 통해 프로젝트의 규모가 커지거나 요구 사항이 변경될 때 쉽게 확장 및 수정할 수 있습니다.
공통 기능이나 코드를 재사용하기 쉬운 구조로 개발하여, 비슷한 요구 사항이 있는 다른 프로젝트에서도 사용할 수 있도록 합니다. 

각 구성 요소를 독립적으로 개발하고 유지 관리할 수 있도록 구조화하면, 애플리케이션의 유연성이 향상됩니다.

 

 

MVC패턴의 장점

MVC 패턴 외에도 MVP(Model - View - Presenter), MVVM(Model-View-ViewModel) 등의 디자인 패턴이 존재하는데,
MVC 패턴과 다른 패턴과 비교했을 때의 장점은 다음과 같습니다.

• 각 구성 요소의 역할이 명확하게 분리되어 있어, 코드의 가독성과 유지 관리가 용이합니다.
• 구성 요소간의 낮은 결합도로 인해, 코드의 재사용성이 높아지며, 개별 구성 요소를 독립적으로 개발, 수정 및 테스트할 수 있습니다.
• 동일한 모델을 여러 뷰에서 사용할 수 있으므로, 애플리케이션의 유연성이 향상됩니다.

 

 

 

References

https://developer.mozilla.org/ko/docs/Glossary/MVC

MVC - MDN Web Docs 용어 사전: 웹 용어 정의 | MDN

https://dev.to/mahmoudessam/model-view-controller-pattern-mvc-20i8

Model View Controller Pattern (MVC)

https://www.freecodecamp.org/news/the-model-view-controller-pattern-mvc-architecture-and-frameworks-explained/

The Model View Controller Pattern – MVC Architecture and Frameworks Explained

https://code-lab1.tistory.com/220

[Web] MVC 패턴이란? MVC 패턴의 등장 배경