오늘은 SwiftUI에서 사용될 아키텍처에 대해서 알아보겠습니다.
아키텍처를 고민하고, 적용하는 이유는 다음과 같다고 생각합니다.
-
코드의 가독성을 향상시킨다.
-
코드를 변경하기 쉽다.
-
기존의 코드에 무언가 추가하기 쉽다.
-
코드를 테스트하기 쉽다.
이것들 이 외에도 있겠지만, 개인적으로 느낀 아키텍쳐 적용 시 장점들을 입니다.
이것들을 3 개의 키워드로 정리하면, "모듈성", "확장가능성" 그리고 "가독성" 으로 정리할 수 있겠네요.
이런 개념적인 설명이 아니라 이번 글에서는 SwiftUI에서 어떻게 적용하는지에 대한 구체적인 이야기를 하겠습니다.
1. Problem
제가 생각한 문제정의는 다음과 같습니다.
SwiftUI에서는 어떻게 구조를 나눌 수 있을까?
그래서 더이상 나눌 수 없는 가장 작은 단위로부터 시작해보려고합니다. (like 원자)
SwiftUI를 통해서 앱을 구성할 때, 크게 보면 3 가지정도로 생각해볼 수 있습니다. (특정 패턴 적용안한 상태에서)
- 화면을 보여주는
View - 데이터를 연산하는
ObservableObject(like ViewModel) - 데이터를 정의하는
Data Object
문제에 대해서 정의하고 어떻게 풀어갈지 정했으니 코드를 작성해보겠습니다.
2. Solution
View의 코드입니다.
struct TodoListView: View {
@StateObject private var todoObservableObject = TodoObservableObject()
var body: some View {
VStack {
List(todoObservableObject.taskList) { task in
Text(task.name)
.foregroundColor(.black)
.font(.title2)
}
}
}
}ObservableObject코드입니다.
class TodoObservableObject: ObservableObject {
@Published var taskList: [Task] = []
init() {
self.getTaskList()
}
func getTaskList() {
taskList = [
Task(name: "아침 5시에 기상"),
Task(name: "이불정리"),
Task(name: "아침 조깅"),
Task(name: "TIL 작성")
]
}
}DataObject코드입니다.
struct Task: Identifiable {
let id = UUID()
var name: String
}폴더구성입니다.
3. 정리
보면, ObservableObject라는 이름 대신에 ViewModel이라고만 붙이면 MVVM 아키텍쳐 패턴으로 구성됩니다. 다만 이번에는 가장 작은 컴포넌트 단위를 알아보기 위해서 ObservableObject라고 이름을 붙였습니다. 이곳에 Combine을 엮기 시작하면, 정말 아름다워지겠죠?^^
- V: View / OO: ObservableObject / DO: DataObject
- SwiftUI의 에서 가장 작은 단위로 쪼갠 3 개의 객체이다.
- UIKit에서 MVC와 다르게 V와 Controller의 기능이 확실히 구분되어있다.
읽어주셔서 감사합니다.
iOS & Flutter