[30] 리액트 리덕스 # 1

리덕스 ?

리액트에서 사용률이 높은 상태관리 라이브러리이다.

상태관련 로직들을 다른파일로 분리하여 효율적으로 관리 할수있으며 글로벌 상태 관리도 쉽게 할수있다.

Context API 와 useReducer Hook 을 사용해서 개발하는 흐름과 리덕스는 굉장히 유사 하다.

Context API 와 차이점 ?

1. 미들웨어

리덕스에는 미들웨어라는 개념이 있다.

미들웨어를 통해서 액션 객체가 리듀서에서 처리되기 전에 원하는 작업을 수행할수있도록 만들수있다.

• 특정 조건에따라 액션이 무시됨
• 액션을 콘솔에 출력하거나 , 서버에 로깅할수있음
• 액션이 디스패치됐을대 이를 수정해서 리듀서에 전달할수있음
• 특정 액션이 발생했을때 다른액션을 발생하게할수있음
• 특정 액션이 발생했을때 특정자바스크립트 함수를 실행시킬수있다.

주로 비동기 작업을 처리할때 사용된다.

2. 유용한 함수 , Hook 사용가능

connect 함수를 사용해 리덕스 상태 또는 액션 생성함수를 컴포넌트의 props 로 받아올수있다

useSelector, useDispatch, useStore 과 같은 Hooks를 사용하면 손쉽게 상태를 조회하거나 액션을 디스패치 할 수 있음

3. 하나의 커다란 상태

모든 글로벌 상태를 하나의 커다란 상태 객체에 넣어 사용한다.

리듀서 사용할때 키워드

1. 액션 (Action)
2. 상태에 변화가 필요할 때 발생시킴 (객체하나로 표현)type을 필수로 그외의 값들은 개발자 마음대로 생성
3. 액션 생성함수 (Action Creator)
4. 컴포넌트에서 더욱 쉽게 액션을 발생시키기 위함필수 아님
5. 리듀서 (Reducer)
6. 변화를 일으키는 함수현재의 상태와 액션을 참조하여 새로운 상태를 반환
7. 스토어 (Store)
8. 한 애플리케이션당 하나의 스토어현재의 앱 상태와, 리듀서, 내장함수 포함
9. 디스패치 (dispatch)
10. 스토어의 내장함수액션을 발생 시키는 것