리덕스란?
컴포넌트 간(cross-component) 또는 앱 전반적 state(app-wide state)를 위한
상태 관리 시스템(state management system)
우리가 state, 즉 우리 애플리케이션을 변경하고 화면에 표시하는 데이터를 관리하도록 도와준다.
리덕스는 우리가 그런 데이터를 다수의 컴포넌트나 심지어 앱 전체에서 관리하도록 도와준다.
state의 종류 | |
Local State | 데이터가 변경되어 하나의 컴포넌트에 속하는 UI에 영향을 미치는 State 컴포넌트 내부에서 useState와 useReducer로 관리된다. |
Cross-Component State | 다수의 컴포넌트에 영향을 미치는 state prop chain이나 prop drilling이 필요하다 |
App-Wide State | 앱 전반에 걸쳐 영향을 끼치는 state (ex : user authentication 사용자 인증) prop chain이나 prop drilling이 필요하다 |
cross-component나 App-Wide State의
props 함수를 업데이트 하는 건 번거로울 수 있다.
그래서 배운 것이 React context..
그런데
왜 리덕스가 필요한가?
이미 React context도 있는데.
▶ React context의 단점
1. 중형 이상의 애플리케이션에서 설정과 관리가 복잡해 질 수 있다.

즉, 위와 같이 ContextProvider가 많이 중첩된 JSX코드가 나올 수 있다.
모든 state와, 여러 다른 종류의 state를 하나의 Context에 관리를 하려고 할 수 있다.
그러면 다양한 것들을 관리하기 때문에 유지 관리가 어려워질 수 있다.
2. 성능문제
데이터가 자주 변경되는 경우, 유동적인 상태 관리 라이브러리(Flux-like state propagation)를 대체할 수 없 게 된다. 리덕스가 Flux-like state propagation에 해당한다.
'공부기록 > [강의노트] Udemy React 완벽가이드 201~300' 카테고리의 다른 글
# 247 [udemy React 완벽 가이드 노트] 클래스 기반 컴포넌트가 있는 리덕스 (0) | 2022.10.12 |
---|---|
# 243 [udemy React 완벽 가이드 노트] 리액트용 리덕스 스토어 만들기 (0) | 2022.10.12 |
# 241 [udemy React 완벽 가이드 노트] Redux 기능 (0) | 2022.10.12 |
# 239 [udemy React 완벽 가이드 노트] Redux의 작동방식 core foundation (0) | 2022.10.12 |
# 206 [udemy React 완벽 가이드 노트] Input value 가져오기 두가지 방법 (상황에 따른 선택방법) / 두가지 방법에 따른 유효성 검사하기 (0) | 2022.10.06 |