redux-toolkit

    [helper] Redux + Redux-saga

    Preview redux는 단순히 전역 상태 관리를 위한 도구였다. 하지만 우리는 data fetch handling을 통해서 정보 저장을 많이 하기 때문에 redux-saga(middleware)와 redux 결합을 많이 이용하고 있다. (redux-toolkit에서는 crateAsyncthunk가 있다) 여기서 api 추가할 때마다, action과 fetch 상태를 만들어줘야 하는 중복 패턴이 발생하게 되어 이것을 쉽게 해결하고자 helper 함수를 제작하였다. helper/type.d.ts 전체 코드 helper에서 공통으로 사용하는 type 관리 코드 설명 import { ActionCreatorWithPreparedPayload } from '@reduxjs/toolkit'; import { F..

    [setting] Next + Redux

    Preview reducer, saga, store, type 설정 store/rootReducer.ts 전체 코드 reducer 여러 reducer 들을 combineReducers로 하나로 묶음 const reducer = combineReducers({ [FETCH_STATUS]: fetchStatusReducer, [USER]: userReducer, [POST]: postReducer, [HASHTAG]: hashtagReducer, }); RootState[type] redux에서 state 타입을 항상 써야 하기 때문에 import 하지 않고 global 영역으로 declare 선언 declare global { type RootState = ReturnType; } rootReducer n..