Redux

자. Redux, MobX, Recoil
이거 왜 쓰냐. 상태관리 해주는 라이브러리다.

그럼 리덕스를 사용할때 키워드를 숙지해보자.

액션 (Action)

상태에 변화가 필요할 때 발생시킴 (객체하나로 표현)
type을 필수로 그외의 값들은 개발자 마음대로 생성

{
  type : "뭐시기",
  data : {
    id : "",
    text : "",
  }
}

액션 생성함수 (Action Creator)

컴포넌트에서 더욱 쉽게 액션을 발생시키기 위함
필수 아님

export function addSomething () {
	return {
   		type: "ADD_SOMETHING",
        data
    }
}

리듀서 (Reducer)

변화를 일으키는 함수
현재의 상태와 액션을 참조하여 새로운 상태를 반환

function reducer(state, action) {
 	return __ // 상태 업데이트 로직 
}

function counter(state, action) {
  switch (action.type) {
    case 'INCREASE':
      return state + 1;
    case 'DECREASE':
      return state - 1;
    default:
      return state;
  }
}

스토어 (Store)

한 애플리케이션당 하나의 스토어
현재의 앱 상태와, 리듀서, 내장함수 포함

디스패치 (dispatch)

스토어의 내장함수
액션을 발생 시키는 것

리덕스의 3가지 규칙

1. 하나의 애플리케이션 안엔 하나의 스토어
2. 상태는 읽기전용 ( 리액트의 불변성 )
3. 변화를 일으키는 함수, 리듀서는 순수한 함수