2월 13일 여정 36일차이다.

리덕스의 액션, 액션 생성함수, 리듀셔, 스토어, 디스패치, 구독 다 무엇을 뜻할까?

오늘의 Today I Learned

1. 스토어

스토어는 기본적으로 저장소를 말한다. 리덕스에는 한 어플리케이션당 하나의 스토어가 있다. 또한 스토어 안에는 현재 앱 상태, 리듀서가 들어가 있고 내장함수들이 있다.

2. 액션

액션은 어떤 행동을 뜻한다. 즉 이 액션을 통하여 어떤 행동을 발생시킨다. 액션은 하나의 객체로 표현된다.

{
  type: "ADD_TODO",
  data: {
    id: 0,
    text: "리덕스 배우기"
  }
}

또한 액션에는 type 필드를 필수적으로 가지고 있어야 한다.

2. 액션 생성함수

액션 생성함수는 액션을 만드는 함수이다. 파라미터를 받아와서 액션 객체 형태를 만든다.

export const changeInput = text => ({ 
  type: "CHANGE_INPUT",
  text
});

이렇게 만드는 이유는 나중에 컴포넌트에서 쉽게 사용하게 위해서이다.

3. 리듀서

값을 변형하는 하나의 공장이다. 이 리듀서에는 2가지 인자를 받아온다. state라는 현재의 상태와 action이라는 새로운 상태를 만들어 반환한다.

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

리덕스를 사용 할 때는 작은 리듀서들을 만들고 그것을 합쳐서 루트 리듀서를 만들 수 있다.

4. 디스패치

디스패치는 액션을 발생시키는 것이다. 쉽게말해서 리듀서의 액션으로 값을 전달하는 역할을 한다. dispathc(action) 이렇게 쓴다.

5. 구독

구독은 store에 값이 변할 때 마다 새롭게 그 값을 불러오는 역할을 한다. 즉 스토어에 있는 값들을 볼 수 있게 도와준다.
그러나 구독 합수를 쓰지는 않고, useSeletor를 사용하여 리덕스 스토어의 상태를 구독한다.

마지막으로

리덕스 너무 어렵다...