[React]React Redux란?

⭐ Redux와 React

Redux에 대해 설명하기 전에 Redux와 React의 관계에 대해 먼저 알고 가자!
Redux는 상태 관리 라이브러리이다.
지금까지 "Redux는 React에서 쓰는 라이브러리다"라고 알고 있었는데 잘못된 지식이였다..
Redux는 JavaScript의 상태 관리 라이브러리 중 하나일뿐, React에 종속된 기술이 아니다!!
React Redux라는 React 전용 상태 관리 라이브러리가 따로 존재한다.
이 글에서는 React Redux에 대해 설명할 것이다.
아래에서 Redux라 부르는 것은 모두 React Redux다!!

---

⭐ 그래서 Redux란?

React에서 state는 컴포넌트 안에서 관리 되는데,
자식 컴포넌트끼리는 데이터를 주고 받을 수 없어서 부모 컴포넌트를 거쳐야 한다.
간단한 프로젝트라면 로컬에서 상태관리를 해도 되지만, 프로젝트의 규모가 커질수록 코드가 복잡해진다.

Redux를 사용한다면 state를 하나의 공간에 모아두고 전역으로 관리할 수 있어서
코드 가독성도 좋아지고 상태 관리가 편리해진다는 장점이 있다!

---

⭐ Redux 구성 요소

• Action
  애플리케이션에서 스토어에 운반할 데이터를 말함.
  자바스크립트 객체 형식으로 되어있음.
  type 필드(=액션의 이름)는 필수임!
  상태에 어떤 변화가 필요하면 액션이라는 것이 발생🚨
• Dispatch
  액션을 발생시키는 역할
  전달받은 action을 state와 함께 reducer에 다시 전달
  이 함수가 호출되면 store는 reducer()를 실행시켜서 상태를 변경 함.
• Store
  애플리케이션의 state(상태)를 저장하는 곳.
  하나의 프로젝트에는 오직 하나의 store만 존재함.
  컴포넌트에서 상태 정보가 필요할 때 store에 접근함.
• Reducer
  상태 변화를 일으키는 함수.
  Action을 Reducer에 전달 ➡️ Reducer가 Store의 상태를 업데이트
  Action을 Reducer에 전달하기 위해서는 dispatch() 메소드를 사용해야 함.