본문 바로가기

공부기록/[강의노트] Udemy React 완벽가이드 201~300

# 237 [udemy React 완벽 가이드 노트] 왜 Redux인가?

리덕스란?

 

컴포넌트 간(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에 해당한다.