Redux 데이터 흐름

Redux 단방향 흐름

Redux는 전역 상태 저장소가 아니라 이벤트를 action으로 기록하고 reducer로 상태를 계산한 뒤 selector로 화면에 전달하는 단방향 데이터 흐름입니다.

01

Action 생성

사용자 의도나 서버 응답을 type과 payload가 있는 명시적 이벤트로 표현합니다.

event
02

Dispatch

컴포넌트나 thunk가 store에 action을 보내 상태 변경 요청을 시작합니다.

dispatch
03

Reducer 계산

이전 state와 action으로 새 state를 순수하게 계산하고 불변성을 유지합니다.

reduce
04

Selector 읽기

화면에 필요한 파생 데이터를 selector에서 계산해 컴포넌트 의존 범위를 좁힙니다.

select
05

Middleware 처리

비동기 요청, 로깅, 추적 같은 부수효과는 middleware에서 제어합니다.

side effect
Action
무슨 일이 일어났는가 상태를 어떻게 바꿀지보다 도메인 이벤트를 명확히 표현합니다.
명명 중요
Reducer
상태 전이 규칙 같은 입력이면 같은 출력이 나와야 하며 외부 요청을 직접 수행하지 않습니다.
순수 함수
Selector
읽기 모델 구성 컴포넌트가 state 구조 전체를 알지 않도록 필요한 값만 뽑습니다.
memoization 가능

Redux 사용 기준

전역 필요성 로컬 상태로 충분한 값을 Redux에 올리면 복잡도만 증가합니다.
불변 업데이트 상태를 직접 mutate하면 변경 감지와 디버깅이 어려워집니다.
비동기 위치 API 호출과 retry, cancel은 reducer가 아니라 middleware나 thunk에서 다룹니다.