Redux

리덕스는 리액트 생태계에서 가장 사용률이 높은 상태관리 라이브러리 이다.
(npm trend 기준으로 45% 나 ㄷㄷ..)

리덕스를 사용하면 우리가 만들게 될 컴포넌트 상태 관리 로직들을 다른 파일들로 분리시켜서

더욱 효율적으로 관리할 수 있으며 글로벌 상태도 관리할 수 있다.

리덕스 언제 써야할까?

위에서 언급한 대로 리덕스는 장점이 확실하지만 꼭 리덕스를 사용해야 하는것은 아니다.

단순히 글로벌 상태 관리를 위해서라면, 관리해야할 글로벌 상태가 별로 없다면

그런 경우 ContextAPI를 활용하는 것만으로 충분할 수 있다.

프로젝트의 규모가 크다 && 비동기 작업을 자주한다 && 리덕스가 편하다
------>>> Redux

!(프로젝트의 규모가 크다) && !(비동기 작업을 자주한다) && !(리덕스가 편하다)
-----> ContextAPI

리덕스의 장점

1. 미들웨어 기능

리덕스는 미들웨어 기능을 가지고 있는데 이를 이용하여 다음과 같은 작업을 할 수 있다.

• 특정 조건에 따라 액션이 무시되게 만들 수 있다.
• 액션을 콘솔에 출력하거나, 서버쪽에 로깅을 할 수 있다.
• 액션이 디스패치 됐을 때 이를 수정해서 리듀서에게 전달되도록 할 수 있다.
• 특정 액션이 발생했을 때 다른 액션이 발생되도록 할 수 있다.
• 특정 액션이 발생했을 때 특정 JS 함수를 실행시킬 수 있다.

(대충 당구장 표시) 비동기 작업을 더욱 체계적으로 관리할 수 있다..

2. 유용한 함수, Hooks

connect , useSelector , useDispatch , useStore ...

3. 기본적인 최적화가 이미 되어있다.

4. 아주 유용한 개발자 도구가 있음 (Redux DevTools)

리덕스에서 사용되는 키워드

Action - 상태 업데이트를 해야할 때 어떤 정보를 업데이트할지 정보를 지니고 있는 객체 , 타입값을 필수로 가지고 있어야 한다.

Action Creator(액션 생성함수) - 액션객체를 만들어주는 함수 조금 더 편하게 개발하자고 사용하는 함수, 필수는 아니다.

Reducer - 상태를 바꿔주는 함수, state와 action 객체를 parameter로 받아와서 새로운 상태를 만들어 준다.

Store - 현재 앱의 상태와 리듀서가 들어있다.

dispatch - 스토어의 내장함수 dispatch를 통해 Action을 발생시킬 수 있다.

subscribe - dispatch를 통해 Action이 발생될 때 파라미터로 전달한 함수를 호출할 수 있다.

리덕스의 3가지 규칙

1. 하나의 애플리케이션엔 하나의 스토어가 존재한다.

• 여러개의 스토어가 있어도 상관없는데 권장되지는 않음
• 특정 업데이트가 빈번하게 발생되면 App의 특정 부분을 분리시키게 될 때 스토어를 여러개 만들기도 하는데 일반적인 방법은 아님
• 스토어가 여러개 됐을때 개발자 도구를 제대로 활용하지 못함.
  

2. 상태는 읽기전용이다.

• 불변성을 지켜주어야 한다는 소리
• 불변성을 지키는 이유는 좋은 성능을 지켜내기 위함
• 불변성을 지켜야만 컴포넌트들이 제대로 리렌더링됨
  

3. 변화를 일으키는 Reducer 함수는 순수 함수여야 한다.

• 동일한 인풋 -> 동일한 아웃풋

• 리듀서 바깥에 있는 변수에 의존해서는 안된다 (상수라면 상관 x , 변수는 값이 변경되니까)

• Reducer는 입력받는 state와 action 에게만 의존해서 새로운 상태를 만들어야한다.

  일단 여기까지..