CS/프로그래밍

MVC, MVP, MVVM 모델

Haegnim 2023. 7. 9. 01:47

더 많은 아키텍처 디자인 패턴은 피그마로 정리하였습니다.

 

Figma

Created with FigJam

www.figma.com

 

사전에 알아야 하는 개념

Presentation(프레젠테이션) 로직
실제 눈에 보이는 GUI 화면을 구성하는 코드

비즈니스 로직
데이터를 보여주기 위해서 데이터베이스를 검색하는 코드 및 GUI 화면에서 새롭게 발생된 데이터를 데이터베이스에 저장하는 코드

 

의존성이 강해지면?
하나의 데이터의 변화가 다른 데이터의 변화를 함께 불러옴
상호간의 연결이 강해진다는 뜻으로 유지 보수하기 어려워진다

 


MVC


특징

  • 컨트롤러와 뷰는 1:n 관계입니다.
  • 컨트롤러는 뷰를 선택할 뿐 업데이트 하지 않습니다.
  • 업데이트는 
(model에서 view로 데이터를 받아올 때 || view가 model을 직접 이용할 때 )
발생합니다.

장점

  • 가장 많이 쓰이고 있는 디자인 패턴입니다.
  • 개발 속도를 병렬적으로 가속화 시킬 수 있습니다.
  • 여러 개의 뷰를 모델에 빌드할 수 있습니다.
  • 비즈니스 로직과 데이터가 분리되어 있기 때문에 코드 복제가 제한됩니다.
  • 컨트롤러가 여러개의 뷰를 선택 가능합니다.
  • 데이터를 가공없이 리턴합니다.

단점

  • 뷰와 모델의 의존성이 높습니다.
  • 뷰 쪽 로직이 복잡하게 구현되어야 하는 경우에는 적절하지 않습니다.

MVP

특징

  • 뷰와 모델의 의존성을 해결합니다.
  • 프레젠터는 뷰와 모델의 중계자 역할을 합니다.
  • 뷰와 프레젠터는 1:1관계입니다.

장점

  • 디버깅을 더 쉽게 만듭니다. 세 가지 다른 계층의 추상화를 소개하기 때문입니다.
  • 코드 재사용성이 높아집니다. 뷰를 컨트롤 하기 위해 여러개의 프레젠터를 가질 수 있습니다.
  • 더 나은 관심사 분리를 실행할 수 있습니다. 비즈니스 로직과 영속성 로직을 분리할 수 있습니다.

단점

  • 뷰와 프레젠터 사이의 의존성이 높아집니다.
  • 뷰와 프레젠터가 1:1관계이기에 뷰 쪽 중심적으로 설계되며 다양한 뷰에 대한 프레젠터 기능의 재사용이 힘들어집니다.


MVVM

특징

  • command 패턴과 Data binding 두 가지 패턴을 사용하여 구현되었습니다.
  • 뷰 모델과 뷰는 1:n 관계입니다.
  • 변경된 모델(데이터)은 뷰에 알릴 필요없이 자동으로 뷰에 전달됩니다.
  • 뷰는 자신이 이용할 뷰모델을 선택해 바인딩하여 업데이트를 받습니다.
  • 뷰모델은 뷰를 나타내주기 위한 모델이자 뷰의 프레젠테이션 로직을 처리합니다.
  • 뷰모델은 뷰를 모르고 모델은 뷰와 뷰모델을 모르는 구조입니다.

장점

  • 테스트에 용이합니다. 각각의 모든 코드는 매우 작은 단위를 유지합니다. - 적절한 방법으로 구현되었다는 전제하에 내부적 외부적 의존성을 유지합니다.
  • 작은 단위로 분리하여 유지보수에 유리합니다.
  • 뷰를 추상화해서 비즈니스 로직 뒤에 있는 코드가 줄어들게 합니다.
  • 로직과 프레젠테이션 계층은 느슨하게 결합됩니다.
  • 뷰와 모델사이의 의존성을 없앱니다. && 뷰모델과 뷰 사이의 의존성이 없습니다.
  • UI 레이어 개발 생산성이 좋아질 수 있습니다.

단점

  • 설계가 쉽지 않습니다.

참고자료

MVC, MVP, MVVM, MVI

MVVM과 FLUX에 대하여...

MVC, MVP, MVVM 비교 – 마기의 개발 블로그 – 즐겁게 개발을 하고 싶은 욕심 많은 개발자

MVC, MVP 그리고 MVVM 패턴에 대하여

<GoF의 디자인패턴> 1. 서론

Data Binding

UI 디자인 (MVVM, MVC, MVP) 패턴 정리

[React] Flux 패턴 알아보기

프론트엔드에서 MV* 아키텍쳐란 무엇인가요?

옵저버 패턴(Observer Pattern)

 

'CS > 프로그래밍' 카테고리의 다른 글

이벤트 버블링  (4) 2023.07.16
클로저  (2) 2023.07.16
await, async  (0) 2023.07.02
forEach()와 map의 차이점  (0) 2023.07.01
객체 지향 프로그래밍  (0) 2023.06.25