본문 바로가기
Swfit

ReactorKit 기본 개념

by GGShin 2022. 12. 11.

ReactorKit이란 reactive하고 단방향의 흐름을 갖는 Swift application 설계를 돕는 프레임워크 입니다. 

사용하는 사람마다 다르게 받아드린다는 MVVM 패턴을 좀 더 정형화하여 일관된 형태로 개발을 할 수 있도록 도와주는 프레임워크로 알고 있습니다. 

🏷 Reactive programming이란?
In computing, reactive programming is a declarative programming paradigm concerned with data streams and the propagation of change. - Wikipedia
변화의 전파와 데이터 흐름과 관련된 선언적 프로그래밍 패러다임으로, 데이터가 변경 될 때 마다 이벤트를 발생시켜서 데이터를 계속적으로 전달한다.
+ 비동기 프로그래밍 패러다임

🏷 Asynchronuous한 작업이 필요한 이유?
사용자 경험을 향상시키기 위해서. Main thread가 멈추거나 느려지지 않도록 하여 사용자들에게 부드러운 이용 경험을 제공하려고 한다. Main thread를 안정적으로 유지하려면 무겁거나 시간 소요가 큰 작업을 background에서 진행해야 한다. 그렇기 때문에 비동기 작업이 필요하다. 

 

1. 기본 컨셉

ReactorKit 흐름도

사용자의 action과 view의 state가 observable streams을 통해 각 layer로 전달됩니다. 이러한 streams의 움직임은 단방향적으로 움직입니다. View는 action만 emit할 수 있고 reactor는 state만 emit할 수 있습니다.

 

1) View

View controller와 cell을 view라고 부릅니다. View는 data를 표시하는 역할을 합니다. 사용자의 input을 action stream으로 bind하고, view state를 각각의 UI components에 bind하기도 합니다. View는 action stream과 state stream을 어떻게 map할 지 정할 뿐, business logic은 정의되어 있지 않습니다

View는 "View" protocol을 구현합니다. View protocol을 구현하면, reactor라는 이름의 property를 자동적으로 갖게 됩니다. reactor property에 변화가 생기면 bind(reactor:)가 호출됩니다. bind(reactor:) method 내부에서는 action stream과 state stream을 binding해줍니다. 

 

2) Reactor

Reactor는 UI와 독립적인 layer로, view의 state를 관리합니다. 모든 view는 각각의 reactor가 있으며 reactor에 logic적인 부분을 모두 위임합니다. Reactor는 View와 독립적으로 존재하기 때문에 테스트하기가 간편해집니다. 

Reactor는 "Reactor" protocol을 구현합니다. Reactor protocol을 구현하면, Action, Mutation과 State 타입을 정의하게 됩니다. 그리고 initialState라는 property도 필요합니다. 

 

- Action: 사용자 interaction을 명시

- Mutation: Action과 State를 연결하는 다리 역할

- State: view state를 명시

Reactor에서는 action stream을 state stream으로 변환하는 작업이 수행되는데, mutate()와 reduce()라는 두 단계를 거쳐 변환이 일어납니다. 

mutate()

Action을 받아서 Observable<Mutation>을 생성합니다. 

func mutate(action: Action) -> Observable<Mutation>

비동기 작업이나 API 호출 등의 side effect를 mutate에서 실행하면 됩니다. 

 

reduce()

reduce()는 이전 State와 Mutation으로 새로운 State를 생성해줍니다.

새로운 State만을 동기적으로 return할 뿐, 다른 side effects를 수행하면 안됩니다. 

 

transform()

transform()은 각각의 stream을 변형합니다. 세 가지 종류의 transform() methods가 존재합니다. 

func transform(action: Observable<Action>) -> Observable<Action>
func transform(mutation: Observable<Mutation>) -> Observable<Mutation>
func transform(state: Observable<State>) -> Observable<State>

observable streams들을 transform하고 combine하기 위하여 해당 methods를 사용해주면 됩니다. transform(mutation:)을 사용하면 global event와 mutation stream을 합칠 수 있습니다. (세부사항은 github 설명 참조)

dubugging 목적으로도 사용될 수 있습니다. 

 

 

https://medium.com/styleshare/reactorkit-%EC%8B%9C%EC%9E%91%ED%95%98%EA%B8%B0-c7b52fbb131a

 

ReactorKit 시작하기

오늘은 StyleShare에서 ReactorKit을 사용한지 딱 1년이 되는 날입니다. ReactorKit은 반응형 단방향 앱을 위한 프레임워크로, StyleShare와 Kakao를 비롯한 여러 기업에서 사용하고 있는 기술입니다.

medium.com

 

ReactorKit 예제 모음

 

1. RxTodo

https://github.com/devxoul/RxTodo

 

GitHub - devxoul/RxTodo: iOS Todo Application using RxSwift and ReactorKit

iOS Todo Application using RxSwift and ReactorKit. Contribute to devxoul/RxTodo development by creating an account on GitHub.

github.com

 

2. ReactorKit Examples (Storyboard based)

https://github.com/ReactorKit/ReactorKit/tree/master/Examples

 

GitHub - ReactorKit/ReactorKit: A library for reactive and unidirectional Swift applications

A library for reactive and unidirectional Swift applications - GitHub - ReactorKit/ReactorKit: A library for reactive and unidirectional Swift applications

github.com

 

3. UIAlert 관련 내용 있음

https://github.com/kbw2204/ReactorKitPractice/blob/master/ReactorKitPractice/ReactorKitPractice/ViewController.swift

 

GitHub - kbw2204/ReactorKitPractice: ReactorKit 연습 프로젝트 입니다.

ReactorKit 연습 프로젝트 입니다. Contribute to kbw2204/ReactorKitPractice development by creating an account on GitHub.

github.com

4. Action, Mutate, State 예시

https://red-cherry-ring.tistory.com/18

 

[iOS] RxSwift, ReactorKit를 이용한 MVVM 구조

RxSwift - 비동기 처리를 쉽게 처리할 수 있게 해주는 라이브러리. - 강력한 Operator. https://cocoapods.org/pods/RxSwift RxSwift RxSwift is a Swift implementation of Reactive Extensions cocoapods.org ReactorKit - 단방향 데이터

red-cherry-ring.tistory.com

 

반응형