MVC / MVP / MVVM 이해하기

MVC 패턴

구성

1. Model: 어플리케이션에서 사용되는 데이터와 그 데이터를 처리하는 로직을 담당

2. View: 사용자에게 보여지는 UI 담당

3. Controller: 사용자의 입력을 받고 처리하는 부분

 

동작 방식

View에서 사용자가 액션

-> Controller에 액션이 전달됨, Model이 처리해야될 일이면 Model로 액션을 전달

-> Model이 데이터를 처리

-> Model이 View로 업데이트된 데이터를 전달

 

특징

1. Controller는 여러개의 View를 선택할 수 있는 1:N 관계를 갖음

2. Controller는 View에 직접 데이터를 전달하지는 않음

 

장점

가장 단순하고 많이 쓰이는 보편적인 패턴

 

단점

View와 Model 사이의 의존도가 높음 -> 앱이 커지고 복잡해질수록 유지보수가 어려워짐

 

 

------------------------------------

 

 

MVP 패턴

구성

1. Model: 어플리케이션에서 사용되는 데이터와 데이터를 처리하는 로직을 담당

2. View: 사용자에게 보여지는 UI를 담당

3. Presenter: 사용자의 요청을 처리하고 View와 Model을 연결

 

동작 방식

View에서 사용자가 액션

-> Presenter에 액션이 전달됨, Model이 처리해야될 일이면 Model로 액션을 전달

-> Model이 데이터를 처리 후 Presenter로 응답

-> Presenter가 Model의 응답을 View로 전달

 

특징

1. MVC와 달리 Model과 View과 분리됨

2. 오직 Presenter를 통해서만 상태나 변화를 알려줄 수 있음

3. Prenseter와 View가 1:1 관계를 갖음

 

장점

View와 Model의 의존도를 없앰

 

단점

View와 Presenter의 의존도가 높아져, MVC 패턴의 문제를 그대로 가지고 있음

 

 

------------------------------------

 

 

MVVM 패턴

구성

1. Model: 어플리케이션에 사용되는 데이터와 데이터를 처리하는 로직을 담당

2. View: 사용자에게 보여지는 UI를 담당

3. View Model: View를 처리하기 위해 만든 View를 위한 Model, View를 나타내기 위한 데이터와 데이터를 처리하는 로직을 담당

 

동작 방식

Model을 가지고, Command Design Pattern을 통해 View를 위한 ViewModel을 생성

-> ViewModel 인스턴스를 View에 props로 넘겨줌

-> View와 Model이 Data-binding됨

-> View에서 사용자가 액션

-> View Model에 액션이 전달됨, Model이 처리해야될 일이면 Model로 액션을 전달

-> Model이 데이터를 처리 함

-> Presenter가 Model의 응답을 View로 전달

 

특징

1. Command Design Pattern과 Data-Binding, 두가지 패턴을 사용하여 구현됨

2. View와 View Model, View와 Model 간의 의존도 문제가 위 두가지 패턴으로 해소됨

 

장점

의존성이 사라져 각 부분을 모듈화하여 개발할 수 있음

 

단점

View Model을 잘 설계하는 것이 어려움