State란 무엇인가?

React에서 state는 데이터를 보관하며, component는 사용자에게 보관된 데이터를 Render한다.
또한 state는 action 및 event 에 의해 변경될 수 있다.

Redux란 무엇인가?

State의 예

전형적인 자바스크립트 애플리케이션은 state로 채워져있다.

• 사용자에게 보여지는 데이터
• 외부에서 가져오는 데이터(fetch)
• 사용자에게 표시되는 URL
• 페이지 내에서 선택되는 항목(item)
• 애플리케이션의 오류(error)

State 관리 (상태관리)

애플리케이션이 작은 상태로 유지된다면, 하나의 state를 부모 컴포넌트 안에 두는 것만으로도 관리가 가능하지만, To-Do List 기능만 해도 state를 위아래(부모-자식 컴포넌트)로 통과하기 시작한다면 작업이 매우 까다로워지게 된다.

여기서 React 컴포넌트의 state를 관리하기 위한 대안이 있나 생각해볼 때 그 대안이 바로 Redux이다.

Redux

Redux는 한 곳에서 state를 관리하며, React의 바깥에 있는 state를 가져오고 관리하는 로직도 가지고 있다.

Redux 사용을 고려할만한 상황

• React 컴포넌트가 같은 state를 참조해야하지만 부모/자식의 관계가 아닌 경우
• state를 props와 함께 여러 컴포넌트로 넘기는 것에 불편함을 느끼는 경우

Redux Store

Redux에서는 Store가 모든 부분을 지휘한다.

Redux reducer

reducer란 두 개의 파라미터를 받는 순수 자바스크립트 함수.
여기서 두 개의 파라미터는 state와 action이다.

Redux에서