본문 바로가기
🍎 iOS/DevNote

[Architecture] MVVM(Model-View-ViewModel)패턴이란?

by @Eddy 2022. 5. 1.
728x90

코딩을 하다보면 MVVM형식으로 카테고리를 구분하는 사람들이 보인다.

 

MVVM은 Model, View, ViewModel을 의미한다.

쉽게 이야기하면, 화면용 코드와 데이터 처리용 코드를 구분하여 처리하는 것이 MVVM이라 할 수 있다.

 

뷰 - 뷰 모델 - 모델이란?

1. View(뷰)

 - 사용자가 스크린을 통해 보게 되는 앱의 구조, 레이아웃, 형태를 정의한 것.

 - 애니메이션 같은 UI관련 로직은 포함하되, 비즈니스 로직은 포함하지 않는다.

 

2. ViewModel(뷰 모델)

 - 뷰가 사용할 메서드와 필드 구현 및 뷰에게 상태 변화를 전달. (뷰는 뷰 모델의 상태변화를 관찰한다.)

 - 일반적으로 뷰 모델과 모델은 1:n관계에 있다. 뷰 모델은 뷰가 쉽게 사용할 수 있도록 모델의 데이터를 가공해 뷰에게 제공한다.

 

3. Model(모델)

 - 비즈니스로직과 데이터를 포함하는 도메인 모델로, 사용할 데이터에 관련된 동작과 데이터를 다룬다.

 

 

MVVM패턴은 양방향이 아닌 일방향적 관계에 있다.

View는 ViewModel을,  ViewModel은 Model을 인식한다.

반대로 Model은 ViewModel을, ViewModel은 View를 인식하지 못한다.

즉, View에서 ViewModel의 내용을 땡겨올 수 있지만, 역으로 ViewModel이 View에서 내용을 땡겨오면 안 된다는 것..!

 

 

장단점

장점: 왜 이렇게 나눌까? - 독립성, 병렬적 업무 처리 용이, 유지보수 용이

 - Model, ViewModel과 View가 독립적이기 때문에 병렬적 처리와 유지보수가 용이한 것이다.

 - 독립적으로 별개이기에 보여지는 View개발, 알맹이인 Model과 ViewModel을 동시에 개발할 수 있는 것..!

 - 독립적이기에 문제가 생기면 전체 코드를 처음부터 훑어보지 않고, 파트별 테스트해도 되니 유지보수가 용이한 것..!

 

 

일상적인 예를 들어보자. 만약에 내 컴퓨터에서 랜 포트까지의 거리가 20m라고 가정하자.

 - 20m짜리 랜선을 사용하면 한 번에 연결할 수 있어서 편하지만, 랜선이 고장났을 때 20m를 통째로 교체해야하는 비용이 크다. 

 - 20m를 5분할하여 4m씩 5개를 사용한다면, 문제가 생겼을 때 여러번 테스트해야하더라도 4m케이블 하나만 교체하면 되기에 비용이 조금 들게 된다.

 

 

단점: 소규모 프로젝트에는 어울리지 않다.

 - 일단, 디자인 패턴을 적용하여 개발하는 것은 큰 프로젝트를 진행할 때를 대비해 고안된 것이다.

 - 괜히 뷰모델이 너무 커지고, 설계가 복잡해질 수 있다.

 - 그래서 위의 예를 응용하자면, 3m거리의 랜선을 사용하면 되는데, 50cm케이블을 6개 사용하는 것과 같다. 너무 과하다. 단순하게 끝낼 수 있는 것을 복잡하고 비싼 비용을 들여 해결하게 될 수 있다는 의미.

 

 

**참고한 내용**

https://ko.wikipedia.org/wiki/모델-뷰-뷰모델

 

모델-뷰-뷰모델 - 위키백과, 우리 모두의 백과사전

모델-뷰-뷰 모델(model-view-viewmodel, MVVM)은 하나의 소프트웨어 아키텍처 패턴으로-마크업 언어 또는 GUI 코드로 구현하는-그래픽 사용자 인터페이스(뷰)의 개발을 비즈니스 로직 또는 백-엔드 로직(

ko.wikipedia.org

https://velog.io/@k7120792/Model-View-ViewModel-Pattern

 

MVVM 패턴

나의 첫 디자인 패턴 MVVM 패턴을 알아보자 🧐

velog.io

https://fomaios.tistory.com/entry/Design-Pattern-MVVMModel-View-ViewModel-패턴이란-feat-Swift

 

[Design Pattern] MVVM(Model - View - ViewModel) 패턴이란? (feat. Swift)

안녕하세요 Foma 💻 입니다! 오늘은 정말 오랜만에 디자인 패턴을 정리하게 되었는데요. 그 중에서 가장 인기(?)있고 핫한 MVVM 디자인 패턴을 다뤄보려고 합니다. (SwiftUI 또한 기본 디자인 패턴으

fomaios.tistory.com

https://jjjoonngg.github.io/android%20architecture/MVVM/

 

MVVM - Model, View, ViewModel

MVVM - Model, View, ViewModel

jjjoonngg.github.io

 

반응형

댓글