Redux

전역 상태 관리를 가능하게 해주는 library

1. Action

   • setstate와 같은 역할
   • action 자체는 객체지만 action creator는 함수
   • action에는 type이라는 키, 그리고 무엇에 대한 것인지를 value로 담겨서 간다.
   • action에는 또한 그 내용 자체는 payload라는 키에 action에 대한 정보가 담겨있다.

2. Dispatch

   • action을 받아서 reducer들로 넘겨줌
   • 정확히는 combinedreducer에게 넘겨주는데 이 때 combinedreducer는 reducer들의 집합체이다.

3. Reducers

   • function
   • 업데이트 된 스테이트를 반환함
   • swith(action.type)
     • case "..."
     • case "..."

4. Store

   • 말그대로 state들을 모아둠
   • component와 store는 connect라는 함수가 연결해준다
   • connect의 인자는 component가 store로 받아오기만 하는지, 보내기만 하는지, 둘 다 하는지에 따라 다름
   • props로 받아오고 props가 바꼈으므로 re-render

비유를 하자면, 예를들어 서류를 들고 사람이 회사에 찾아간다고 하면 그 서류 자체는 aciton, 서류를 운반하는 사람은 action creator이다.

회사에 도착해서 reception에서 회사의 각 부서에 이러한 action이 왔다고 알려주는데 이때 reception이 dispatch이다.

회사의 각 부서에서는 dispatch로 부터 받은 연락을 보고 본인 부서에 해당하는 action인지를 확인할 때 action 객체의 type을 본다. 이때 각 부서가 각각의 reducer이다. 관련이 없다면 그냥 버리고 관련이 있다면 해당 부서에서 무언가를 처리한다.

회사의 가입 부서에서 action을 받는데 우선 기존 state, 즉 기존 회원 list와 action을 각각 인자로 받는다. 이때 reducer 안에는 switch/case 문으로 이루어져있다.