※ CS 스터디/디자인 패턴

8. MVP 및 MVVM 패턴

J 크 2023. 8. 2. 17:43
728x90
반응형

책의 내용이 너무 짧고 이해하기가 어려워 구글링을 통해 내용을 정리하였습니다. 보다보니 이건 진짜 재밌네유~


♣ MVP 패턴 (Model-View-Presenter)

- MVP 패턴은 MVC에서 controller가 사라지고, 모델(Model), 뷰(View), 컨트롤러(Presenter)로 이루어진 디자인 패턴

- View 와 Model의 각 요소를 보다 명확하게 분리하여 의존성을 해결

MVC 패턴과 유사하며 Controller의 역할을 Presenter가 대체

User의 Input이 View로 들어오는 구조

-  Presenter는 View에서 요청한 정보로 Model에서 받은 데이터를 가공하여 View에게 전달


MVP Pattern


♣ MVP 패턴 동작 과정 예시

 

1. 유저가 ID PW 입력 후 로그인 요청

2. View가 확인에 필요한 데이터를 Present에 요청

3. Presenter는 Model에게 해당 데이터를 요청

4. Model에서 요청받은 데이터를 다시 Presenter에 응답

5. View에 필요한 데이터를 Presenter에서 응답

6. View는 해당 데이터를 출력하여 User가 확인


♣ MVP 패턴 특징

- Model과 View 의 의존성을 해결한 구조를 확인 가능

- 어플리케이션이 복잡해질수록 View와 Presenter 사이 의존성 강해짐

- Presenter 와 View 가 1:1 관계를 형성. ( 각 View 마다 Presenter 필요 )

- 프로젝트가 커질 수록 코드의 증가량이 매우 상승


♣ MVVM 패턴 

- MVC의 C에 해당하는 컨트롤러가 뷰모델(view model)로 바뀐 패턴

- 뷰모델은 뷰를 더 추상화 하여 View와 1:N 구조를 가짐

-  Model 과 View는 MVC와 역할이 동일

-  Data Binding을 활용하여 ViewModel에서 필요한 View 출력 (다형성)


MVVM 패턴


♣ MVVM 패턴 동작 과정 예시

 

1. 유저가 ID PW 입력 후 로그인 요청

2. View가 확인에 필요한 데이터를 ViewModel에 요청

3. ViewModel는 Model에게 해당 데이터를 요청

4. Model에서 요청받은 데이터를 다시 ViewModel에 응답

5. ViewModel은 응답 받은 데이터를 타입에 맞게 저장

6. ViewModel에서 필요한 View를 Data Binding

7. DataBinding한 View를 출력하여 User가 확인


♣ MVVM 패턴 특징

- View와 Model 의존성의 문제가 해결

- Command & Data Binding 으로 View 와 View Model 1:1 문제 해결

- 결과적으로 MVC, MVP 한계점 해결

- 하지만 View-Model의 설계가 쉽지 않음

 이렇게 다양한 방법으로 설계하는 것이 재미있네요....

 위의 글과 관련하여 추가적인 내용이나 피드백은 언제나 환영입니다 :)