[개발일지] MVC, MVVM 패턴

현재 개발하고 있는 Unity 앱은 Firebase와 같은 백엔드에서 데이터를 받아와 UI에 표시해야 하는 것이기 때문에 데이터와 UI를 분리하여 유지보수성을 높여주는데 가장 적합한 패턴을 MVC, MVVM 이라 생각하여 2가지 중 하나의 패턴을 적용할 예정이다.  그럼 이 2가지 패턴에 대한 개념을 다시 한번 공부할겸 정리해보자 

 

1. MVC (Model-View-Controller)  패턴 

구조

1. Model:
   데이터 및 비즈니스 로직을 관리, 데이터베이스나 Firebase와의 통신, 데이터 처리 로직이 포함
2. View:
   사용자에게 보여지는 UI 요소. Unity에서 Canvas, 버튼, 텍스트 필드 등을 뜻한다고 보면 된다!!
3. Controller:
   View와 Model 간의 중재자 역할, 사용자 입력을 받아 처리하고 데이터를 갱신하거나 View를 업데이트

ex. 보다 쉽게 카페로 예시를 들면

** Model은 재료들 (커피 원두, 우유, 설탕 재료) => 이러한 재료들은 손님 눈에 보이지 않음!

** View는 손님에게 보이는 것들 (메뉴판, 테이블) => 손님은 View(메뉴판)과 상호작용은 하지만 재료에 접근할 수 없음!

** Controller은 주문 처리 (바리스타, 계산원) => 손님에게 주문을 받고 Model에서 재료를 가져와 커피 제조 후 손님에게 전달

 

즉! 중요한 것은 View는 Model에 접근할 수 없고, Controller를 통해 데이터를 받을 수 있다는 것  

장점이 많지만 View가 커질수록 Controller 코드가 복잡해지고 그렇게 되면 의존성이 증가할 수 있다. 

그리고 UI 갱신이 잦아지면 유지보수가 어려워질 수 잇다

 

2. MVVM (Model-View-ViewModel)  패턴

구조

1. Model:
   데이터 및 비즈니스 로직 (MVC의 Model과 동일).
2. View:
   사용자 인터페이스(UI). MVVM에서는 View는 ViewModel에 바인딩된 데이터를 표시하는 역할만 함.
3. ViewModel:
   View와 Model을 연결하고, 데이터를 변환하거나 처리하여 View가 사용할 수 있는 형태로 제공. View와 데이터 간의 양방향 바인딩을 지원. (양방향 데이터 바인딩: View와 ViewModel이 실시간으로 동기화되어 UI 갱신이 자동으로 이루어짐 )

ex. 똑같이 이것을 카페로 비유해보면 

** Model은 재료들 (커피 원두, 우유, 설탕 재료) 

** View는 손님에게 보이는 것들 중 키오스크 => 손님은 메뉴판을 통해서 계산원에게 주문하는 것이 아닌 키오스크를 통한 주문!

** ViewModel은 키오스크 내 주문 연결 처리  => 손님이 아메리카노를 선택하면, 키오스크(View)와 창고(Model)가 자동으로 연결되어 필요한 재료가 준비

 

정리하자면 이런 느낌

비유	MVC	MVVM
중재자 역할	바리스타가 주문을 받고 커피를 만듬	키오스크가 데이터를 바로 연결
손님과 데이터 간 거리	손님은 데이터를 보거나 직접 접근할 수 없음	손님이 선택하면, 데이터가 자동으로 연결됨
효율성	작은 카페에서 효율적	큰 카페에서 자동화가 유리

 

 

3. MVC,  MVVM 차이점

 

• MVC :
  간단한 구조와 빠른 개발이 필요한 경우.
• MVVM :
  UI와 데이터 갱신이 잦고 확장성이 중요한 프로젝트.

 

 

추후 사용될 기능들 중 UI 갱신이 잦은 것이 존재하는데 이러한 UI와 실시간 데이터 갱신 등에 적합한 패턴이 MVVM이라 판단이 되어 MVVM 패턴으로 구성할 예정!