아요 개발 일기

[iOS] MVVM 패턴 본문

iOS

[iOS] MVVM 패턴

소진이 2023. 1. 6. 17:27

안녕하세용 :o

오늘은 MVVM 패턴에대해 공부해보도록 하겠습니다!!

회사에서는 코드에 새로운 기능이 추가될 확률이 굉장히 높고, 유지보수 및 테스트가 용이해야하기 때문에 MVVM 패턴을 사용하고있다고해요! 이런저런 부분에서 iOS 공부할때 꼭 필요하니 같이 공부해봅시다!!!!!


 

MVVM이란?

 

MVVM은 Model - View - ViewModel - ViewController로 구성되어있는 소프트웨어 아키텍처 패턴입니다.

저번에 MVC 공부할때 지나치게 ViewController가 커져서 재사용성이 떨어지고 테스트도 하기 어려워진다고 했죠?!

 

이 문제를 해결하기 위해 MVVM에서는 ViewModel을 추가해서 ViewController의 일을 덜어주고 크기를 줄여준 패턴입니다.

때문에 각 구성요소들이 독립성을 가지게되고 테스트하기에도 용이하다고 합니다

 

 

https://www.objc.io/issues/13-architecture/mvvm/

 

 

위 이미지는 MVVM패턴을 나타냅니다.

하지만, 정확히 ViewModel이 하는 일이 무엇인지 잘 모르겠죠?

좀 더 자세히 설명되어있는 이미지를 참고해보면서 역할들을 알아봅시다 :D

 

 

Model

기존 MVC 패턴에서의 Model과 동일한 역할을 합니다. 즉, 데이터에 관련된 부분을 맡고 있습니다.

실제 데이터를 가지고 있으며 ViewModel에 의해 가공되고, 가공된 데이터를 전달해 줍니다.

ViewModel은 Model을 소유하며 View와는 독립적입니다. 즉, View와 직접적으로 소통할 수 없습니다.

 

View  (+ ViewControlelr)

사용자 이벤트를 수신하고 데이터를 표시하는 유저 인터페이스를 책임집니다. (ViewController도 View의 일부)

ViewModel의 변경사항을 감지하고 ViewModel이 업데이트한 데이터를 UI를 업데이트합니다.

 


 

여기서 Data Binding 이란 ?

- Model과 UI의 싱크를 맞추는 것을 말합니다. view와 로직이 분리되어 있어도 한쪽이 바뀌면 다른 한쪽도 업데이트되어 데이터의 일관성을 유지할 수 있습니다.

 

iOS 에서 Data Binding을 하는 방법

  • KVO
  • Delegation
  • Functional Reactive Programming
  • Property Observer

 

ViewModel

사용자의 상호작용을 View가 보내주면 그에 맞는 이벤트를 처리하고, Model의 Read, Update, Delete를 담당합니다.

ViewModel에의해 데이터가 저장되면 Data Binding에 의해 View가 자동으로 업데이트됩니다.

 


 

자세히 살펴보았으니, 과정을 간단하게 정리해볼까요? :D

 

MVVM 과정

 

  1. 사용자가 화면에서 Action을 취하면 Command Pattern으로 View → ViewModel로 전달됩니다.
  2. ViewModel  Model에게 data를 요청합니다.
  3. Model은 요청받은 data를 통해 update된 data를 ViewModel로 전달합니다.
  4. ViewModel은 응답받은 데이터를 가공해서 저장합니다.
  5. View는 ViewModel과의 Data Binding을 통해서 자동으로 갱신됩니다.

 

자 어느정도 이해했으니, 장점과 단점에대해서 알아보겠습니다!!

 

 


 

장점과 단점

장점

1. 유지보수에 좋다.

2. 자동화된 테스팅에 적합한 모델이다. (View Model과 View 간의 의존성이 없기 때문에)

3. 새로운 개발자라도 빠르게 적응이 가능하고 개발이 가능한 수준의 난이도와 복잡성을 가지고있다.

 

단점

1. 단순한 프로젝트를 개발하기에는 MVC에 비해서는 시간이 오래걸린다.

 


차이점을 정확히 알아야 찰떡같은 상황에 잘 사용하겠죠??

MVVM이 MVC랑 뭐가 다른지 알아봅시다!

 

MVVM 은

ViewController가 Model에 직접적으로 접근하지 못합니다.

ViewController가 ViewModel이라는 새로운 클래스를 새로 갖게됩니다. (초반부터 이야기했던 가장 큰 차이점!)

MVC 패턴에서는 ViewController자체가 Controller layer(레이어)에 있었는데, MVVM에서는 View layer에 존재합니다.

 

MVVM이 MVC를 개선한 점

ViewModel을 추가하여, ViewController의 역할을 축소시켰습니다.

 

ViewModel이 생기면!?

 

- 각자의 할일이 명확해짐

- 수정 용이함

- 유지보수 비용 낮음

 


 

마치며.. 🤔

회사에서 MVVM 패턴이 들어간 프로젝트를 맡게되었는데, 저는 MVC만 몇번 사용해봐서 처음에 우왕좌왕했었어요,,,

코드도 분석해보고 이렇게 다른 글들도 찾아가며 공부하니까 MVVM의 매력을 더 알게된 시간이었습니다!!

 

 

마지막으로 총 요약 정리 시간

MVVM 패턴은 MVC의 단점인 Massive View Controller를 해결하고자 ViewModel을 추가하여 ViewController의 크기와 역할을 줄여주는 패턴입니다!

 

새로운 친구 ViewModel의 역할은?????

Model과 여러 Protocol들을 View(Viewcontroller)에서 바로 쓰이게 할 수 있도록 해줍니다!

 

MVC와 MVVM의 다른점은?

MVC는 M / VC 이어서 View와 Viewcontroller가 분리하기 어렵습니다. 그래서 ViewController가 커지는거죠!!

프로젝트가 커지면 ViewController가 엄청엄청 커지겠죠???????

그때 MVVM을 적용하면 M / V / VM 으로 나누어져서 ViewController(View와 같다고 생각하면 됨)가 혼자하던 일을 나누어 가지게됩니다! (그래서 MVVM은 주로 큰 프로젝트를 할때 많이 사용된다고 해요!)

또한, 각자의 역할이 분명해지면서 테스트, 수정이 용이해지고 유지보수 비용이 낮아지는 장점을 가지고 있습니다! :)