Redux_01.

액션

• 상태를 "업데이트를 할 때 어떻게 업데이트 할지 "정보"를 지니고 있는 "객체" 타입값을 필수로 가지고 있어야 한다.

{
 type : "Toggle_value"
}

액션 생성함수

• 액션 객체를 만들어주는 함수

export const increase = (data) => {
  return 
  {
  	type : 'INCREASE',
    	data
  }
}

리듀서

• 상태를 바꿔 주는 것

  리듀서 함수는 "이전 상태"와, 액션 객체를 파라미터로 받습니다. 이전의 상태는 절대로 변경하지 않고, 변화를 일으킨 새로운 상태 객체를 만들어서 반환한다.
  똑같은 파라미터로 호출된 리듀서 함수는 언제나 똑같은 결과값을 반환해야 한다.
  동일한 인풋 => 동일한 아웃풋

스토어

• 현재 앱의 상태와 리듀서가 들어있다.
• 내부함수로는 dispatch와 subscribe가 있다.

리덕스의 3가지 규칙

1. 하나의 애플리케이션엔 하나의 스토어가 있다.
2. 상태는 "읽기전용" === "불변성"을 지켜야한다.
3. 변화를 일으키는 함수 리듀서는 순수함수로 해야한다.

• yarn add redux

Ducks패턴!

• 파일에 액션, 생성타입, 리듀서까지 한꺼번에...!

프리젠테이셔널 컴포넌트

• 단순히 UI 담당
• 재사용

container component

• 컨테이너 컴포넌트란 리턱스에 있는 "상태"를 조회하거나 액션을 "디스패치"
• 리액트 컴포넌트에서 리덕스를 연동할 때에는 useSelector, useDispatch를 사용한다.

리덕스 개발자 도구 사용하기

• 패키지 설치 yarn add redux-devtools-extension
• index.js 파일에서 아래와 같이 만들어준다.

import { composeWithDevTools } from 'redux-devtools-extension';

const store = createStore(combine, composeWithDevTools());