최신 리덕스정리

Redux Saga 읽을거리

Redux 개요

컴포넌트가 많아지면 라이프 사이클, props, state를 이용한 최적화, 업데이트가 힘들어지기 때문에 Redux라는 상태 관리 도구를 이용하면 매끄럽게 해결이 가능하다.

• 스토어 : 어플의 상태 값 내장
• 액션 : 상태 변화시 참조 객체, Action을 정의
• 디스패치 : 액션을 스토어에 전달
• 리듀서 : 상태를 변화시키는 로직이 있는 함수, State를 정의
• 구독 : 스토어 값이 필요한 컴포넌트는 스토어를 구독

• 컴포넌트 밖에서 상태관리 로직을 처리한다
• 어떤 변화를 일으킬 때 액션(오브젝트 형태)을 컴포넌트가 스토어에 전달한다.(디스패치)
• 액션 받으면 스토어가 가지고 있는 리듀서가 전달받은 액션으로 어떻게 변경할지 결정하고 처리하고 새 상태를 스토어에 전달
• 스토어 안의 상태가 바뀌면 스토어를 구독하고 있는 컴포넌트에 바로 전달한다.
• 부모 컴포넌트로 props를 전달하는 것은 생략

[모듈추가]

npm install redux react-redux