Redux에서 사용되는 주요 키워드들

액션(action)

상태에 어떠한 변화가 필요하게 될 때 액션을 발생시킴.
어떻게 업데이트 할지 정의하는 정보를 가진 객체.

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

 

액션 생성함수(Action Creator)

액션을 만들어주는 함수.
단순히 파라미터를 받아와서 액션 객체를 만들어주는 함수이다.
필수는 아니지만, 나중에 더 편하게 액션 객체를 만들 수 있다.

export function addTodo(data) {
    return {
        type: "ADD_TODO",
        data
    };
}
// 화살표 함수로도 가능

 

리듀서(reducer)

상태를 바꿔주는 함수.
액션 타입이 무엇이냐에 따라 다른 업데이트 작업을 한다.
불변성 유지를 위해 spread연산자나 concat함수를 활용하여 기존의 객체나 배열을 새로운 배열을 만들어서 반환해줘야 한다.
default 부분에 기존의 state를 그대로 반환을 해야 한다. Redux에서는 여러개의 sub reducer를 만들고 root reducer를 만들기 때문이다. (reducer 관련 자세한 설명은 추후 포스팅할 예정)

 

스토어(store)

현재 앱의 상태와 리듀서 들어 있고 몇가지 내장함수(dispatch, subscribe 등)들이 들어있음.
하나의 애플리케이션엔 하나의 스토어가 있으며, store의 상태는 읽기전용이다.

 

디스패치(dispatch)

store의 내장함수 중 하나. 
액션을 발생시키는 것. 액션을 스토어한테 전달한다.
액션 객체를 만들어서 dispatch 함수에 파라미터로 넣어서 reducer를 호출 한다.
해당 액션이 리듀서에게 전달이 되어서 리듀서에서 새로운 상태를 반환해주면 store의 상태가 새로워진다.

dispatch({ type: "INCREASE" })

 

구독(subscribe)

store의 내장함수 중 하나.
subscribe 함수를 호출할 때 파라미터로 특정 함수를 넣어주면 action이 dispatch 될 때마다(action이 발생돼서 store의 상태가 업데이트 됐을 때) 설정한 특정 함수를 호출시킬 수 있다.
react에서 redux를 사용하게 될 때 이 함수를 직접적으로 사용하지는 않음. 대신 react-redux 라이브러리에서 제공하는 connect 함수 또는 useSelector Hook을 사용하면 store의 상태가 업데이트 될 때 리렌더링 되는 작업을 대신 처리해줄 수 있다.
결국 컴포넌트를 만들게 되면 컴포넌트가 Redux에 subscribe하게 되는 것.

 

 

 

 

 

https://react.vlpt.us/ 강의자료를 참고하여 작성하였습니다.