[SwiftUI] iOS - MVC/MVVM

륜재·2023년 1월 3일
0
post-thumbnail

1. 소프트웨어 아키텍처 패턴이란?

소프트웨어 디자인 패턴이라고 불리는 소프트웨어 아키텍처 패턴은 코드의 유지보수와 협업을 용이하도록 하기 위해 정해놓은 특정한 규칙과 템플릿의 집합이다.

초기의 UI 개발 방식은 개발자들이 뷰를 만들고, 그 뷰와 관련된 모든 로직을 담는 코드를 해당 뷰를 정의하는 클래스 자체에 함께 작성하였다. 이로 인해, UI를 정의하는 코드와 데이터, 비즈니스 로직들 사이에 매우 강력한 의존성이 생겼다. 이 경우 코드의 확장성과 유지관리에 어려움이 있었다.

이 문제를 해결하기 위해 여러 종류의 디자인 패턴이 생겨났고, MVC(Model-View-Controller)패턴이 많이 사용되었다. 애플은 MVC라는 이름을 가져와 일부 개념을 변형한 MVC 형태의 디자인 패턴(전통적인 MVC보다는 MVP와 유사)을 UIKit에서 사용하였다.

새로운 SwiftUI에서는 ViewController를 사용하지 않고 MV만 남게 되었으나 복잡한 앱을 구현하기 위해 MVVM 패턴 사용을 권장한다.

2. 전통적인 MVC 패턴의 의존성 문제

뷰와 모델이 서로 밀접하게 연결되어 있고, 뷰와 컨트롤러 간에도 의존성이 여전히 존재한다.

3. UIKit의 MVC 패턴

전통적인 MVC 패턴이 갖는 뷰와 모델 간의 의존성 문제를 해결해 서로 독립적으로 존재하지만, ViewController의 역할이 너무 커지는 단점이 있다.

뷰가 모델에 의존하지 않기 때문에 재사용성이 크게 증가한다. 하지만 뷰는 뷰컨트롤러의 속성으로 존재하며 생성부터 해제까지 뷰 컨트롤러에 의해 관리되고 수행된다.

UIKit에서는 스토리보드를 사용해 개발하기 때문에, 정적인 UI구성을 모두 스토리보드에서 작업하기 때문에 자연스럽게 MVC 패턴에 맞추어 코드를 구현할 수 있다. 하지만 코드로 UI를 구현할 경우, MVC 패턴에 맞게 코드를 구현하고 있는지 확인해야 한다.

4. SwiftUI의 MVVM 패턴

MVC에 존재하는 View와 ViewController, View와 Model간 의존성을 낮추었다.

1) Model - 실제 앱이 처리하는 문제와 관련된 비즈니스 로직을 정의하여 데이터를 캡슐화하여 저장한다.

2) View - 버튼, 텍스트 필드처럼 사용자와 상호작용하는 컨트롤이나 색, 글꼴 등 순수한 시각적 요소들을 포함해 사용자가 볼 수 있는 모든 요소를 이용해 UI를 정의한다.

뷰가 뷰모델을 직접 참조하고, 필요한 값을 능동적으로 요청한다. 바인딩된 뷰모델의 값이 변화하면 자동으로 뷰의 값이 함께 갱신된다.

3) View Model - 뷰에 대한 추상화, 데이터 바인딩을 위한 모델 구체화 역할을 수행한다. 뷰모델은 모델의 데이터를 참조하여, 뷰와 모델의 데이터 타입이 일치하지 않는 경우, 뷰에 적합한 형태로 바꾸어주는 역할을 한다. 뷰모델은 뷰의 상태를 저장하고, 뷰에서 발생하는 액션에 따라 수행할 앱의 기능을 정의하는 명령을 구현한다.

4) MVVM 방식의 SwiftUI의 장점

- 이미 다른 곳에서 사용 중이거나, 변경하기 어려운 기존 모델을 사용할 때 모델에 대한 수정 없이 뷰모델을 통해 뷰에서 활용할 수 있다.

- 뷰와 앱의 로직에 대해 독립적으로 동시에 작업할 수 있다.

- UI코드를 분리해 순수하게 앱의 기능과 비즈니스 로직에 집중해서 테스트할 수 있다.

5) MVVM 방식의 SwiftUI의 단점

- 명령형과 비교해 데이터 바인딩으로 연결된 선언형 방식의 프로그래밍은 디버깅이 까다롭다.

- 적절하게 일반화된 뷰모델의 설계가 어렵다.

- 모델의 데이터를 뷰모델에서 다시 작성해야 하기 때문에 추가 코드가 발생한다.

참고자료

  1. 이봉원, 스윗한 SwiftUI, BJ퍼블릭(2020), p633-645
  2. https://nalexn.github.io/clean-architecture-swiftui/
  3. Blog - iOS Coden
    https://velog.io/@ictechgy/MVC-디자인-패턴
    https://velog.io/@ictechgy/MVVM-디자인-패턴
  4. Blog - EEYatHo 앱 개발 이야기
    https://eeyatho.tistory.com/77

0개의 댓글