SwiftUI + TCA 시작하기 #1 — 단방향 Flow는 많이 쓰이는 것일까?

단방향 Flow는 많이 쓰이는 것일까?

annapo
7 min readNov 29, 2023

요즘 iOS에서 가장 많이 쓰이는 아키텍쳐가 뭐야? 라고 묻는다면, repository의 star 수를 확인 할 수 있겠죠.

인기차트? 를 싫어하신다면 죄송합니다. 🥲 저도 사실 상황에 맞게 아키텍쳐를 골라야 한다고 생각합니다.

TCA는 어째서 10k 나 스타수를 받았을까요? TCA가 뭘까요? 시작하기 이전에 왜 쓰는지 이해부터 해보려고 합니다.

아래는 목차 입니다. 아주 길게 작성해 볼 예정입니다. 아주 천천히.. 그리고 몰랐던 것들을 정리하면서 작성할 예정이어서 오래걸릴 것 같아요. 그리고 개념위주가 아닌 실제 프로젝트에 적용하면서의 과정을 기록할 예정입니다.

SwiftUI 상태 관리부터 테스트까지 iOS 개발자를 위한 TCA 1.0 이 책을 읽어도 좋을 것 같아요. 그리고 항상 공식문서를 확인하는 습관..+

  1. SwiftUI + TCA 시작하기 #1 — 단방향 Flow는 많이 쓰이는 것일까?
  2. SwiftUI + TCA 시작하기 #2— 단방향 Flow 이해하기
  3. SwiftUI + TCA 시작하기 #3 — 전체적인 프로젝트 폴더링하기
  4. SwiftUI + TCA 시작하기 #4 — MultiStore 사용하기
  5. SwiftUI + TCA 시작하기 #5 — Navigation 관리하기
  6. SwiftUI + TCA 시작하기 #6 — 비동기 처리 하기
  7. SwiftUI + TCA 시작하기 #7— Test 코드 작성하기

(⭐️ 수집중..) 모든 코드는 아래에서 확인할 수 있습니다. 이사람 플젝을 몇개 하는걸까요? tmi + 세종대학교 캡스톤 디자인에서 하는 프로젝트입니다.

기습 매삼뉴 소식: 앱스토어 뉴스 카테고리 25위까지 찍었음 (🎉)

단방향 Flow 란 무엇일까?

MVVM

MVVM (위키백과 화질 왜이래..)

기존의 MVVM의 문제점(우선 문제점이라고 표현)은 ViewModel이 View와 Model에 의하여 변경된다는 점입니다. ViewModel이 커진다는 것은 사실 비즈니스 로직들이 많으면 ViewModel은 어쩔수 없이 커지겠죠. 핵심은 어느곳에서 View의 데이터들이 업데이트 되는 것인지 확실하게 모른다는 점 입니다.

struct SearchViewModel {
...
var searchedText: String
...
}

검색 View에서 유저가 텍스트필드에 ‘app’ 를 입력을 하면 View는 ViewModel에게 텍스트를 전달하여 searchedText를 ‘app’ 로 업데이트 할 것입니다. 그리고 검색을 하면 다음과 같이 검색 결과가 뜰 것 입니다.

  • app
  • apple
  • appStore

이 검색 결과는 Model에서 가져와서 ViewModel을 업데이트 한 것 입니다. ViewModel은 이렇게 양쪽에서 트리거되어 변경이 이루어집니다.

문제점의 핵심은 ViewModel이 어디에서 업데이트 되는지 확신할 수 없다는 점입니다. 불안에 떨고 있다는 뜻이죠. (🫨) 이게 그렇게 문제일까요? 음..사실 MVVM은 많은 기업에서 사용하고 있는 아키텍쳐 입니다. 잘 관리만 된다면 별로 문제가 아닐 수 있을 것 같아요.

Flux의 단방향 Flow

Facebook이 제시한 Flux 패턴의 구조

그치만 Flux는 이 지점이 문제점이라고 생각하고 Facebook에서 React에 제안한 패턴입니다.

사실 단방향이라는 것은 Flux 패턴에서 출발을 하게 되는데요. Action이 View를 업데이트 하는 방향을 살펴보면 단방향임을 알 수 있습니다.

ReactorKit의 단방향 Flow

ReactorKit

이는 단방향 Flow을 부분 적용할 수 있도록 하는 라이브러리입니다. 기존에 MVVM 패턴에 ReactorKit을 사용하여 단방향 Flow로 ViewModel을 업데이트 하게 설계할 수 있습니다.

RIBs는 단방향 Flow 일까?

RIBs는 그자체로 단방향이라고 할 수 없습니다. Interactor에서 View의 State를 가지고 있는데(Presenter가 있다면) 이 블로그(민소네님 블로그)처럼 Interactor에 ReactorKit을 적용하여 부분적으로 단방향을 적용하는 것을 확인할 수 있습니다.

단방향을 적용시키려는 노력들을 보면 단방향이 필요하구나. 좋으니깐 쓰나보네 정도를 공감할 수 있습니다. 필요성은 직접 해보면서 좋은 지점들을 느끼면 좋다고 생각합니다.

TCA의 등장

뭔가 많이 섞인 것처럼 보입니다. 굉장히 간단해 보이죠?

keynote로 그린 그림을 Tistory에 업로드한 것을 복사 해왔습니다. (제가 그렸음)

TCA의 단방향 Flow는 이렇습니다. 단방향을 위해 태어난 전체적인 아키텍쳐관리를 위한 라이브러리라고 생각하면 됩니다. ReactorKit은 부분 적용을 위한 라이브러리라고 생각하면 좋습니다.

TCA를 사용하게 되면 단방향도 해결하고, 이를 View에서 사용하게 쉽게 도와주는 것들을 사용할 수 있습니다. 단점이 있다면 프로젝트가 전체적으로 TCA에 강하게 의존하게 된다는 점이 단점입니다. 이는 가장 취약한 단점이 될 수 있습니다. 외부 라이브러리에 의해 전체적인 프로젝트를 관리한다면, TCA에서 발생하는 모든 에러를 감수한다는 뜻이 되겠죠.

그래도..! 우리가 우리만의 아키텍쳐를 작성하면 한세월일텐데. 이렇게 아키텍쳐를 도와주는 라이브러리를 사용하는 것에 찬성한다면, 이제 시작해볼 수 있을 것 같아요. 아직 아무것도 설명을 시작 안했는데요, 왜 이런 단방향 Flow의 집착하는 지 공감이 되었으면 해서 이 글로 시작하려고 합니다.

다음으로 넘어가기 전에 저의 TCA 경험에 대해 공유하자면, 프레임워크단에서 의존성 고민도 잘 해주었고, 코드의 통일성을 가져갈 수 있다는 점과 코드가 간단해진다는 점, Store 단위로 완벽하게 재사용이 가능한 독립적인 설계가 가능하다는 점이 좋았습니다. SwiftUI와 찰떡이라고 생각합니다. 앞으로의 트렌드는 TCA가 될거라고 생각합니다.

TCA가 망한 세상의 미래의 나: 가만히 좀 있지 그랬어. 왜이렇게 나댔니..😴

(편지- 23/11/26일 작성)
안녕 잘 지내니.
글 잘 쓰고있겠지? 7개 쓴다고 너가 말했다.

--

--