next.js

Next.js에서 redux toolkit 세팅하기

CSR에서 세팅하는 거랑 뭐가 다른데? Next.js는 서버 사이드에서 렌더링이 이루어집니다(SSR). 그래서 일반적인 CSR 환경에서 리덕스를 사용할 때와 달리 추가적인 작업이 필요합니다. 1. 서버 사이드에서 생성되는 리덕스 store와 이후 클라이언트 사이드에서 생성되는 리덕스 store는 다릅니다. 따라서 이 둘을 합쳐주는 로직이 필요합니다. 서버에서 생성한 store의 상태를 HYDRATE 라는 액션을 통해 client에 합쳐주는 리듀서를 작성해봅시다. action.payload에는 서버에서 생성한 store의 상태가 담겨있어 이 둘을 합쳐 새로운 client 측 store의 상태를 만들게 됩니다. // store/index.tsx import { combineReducers, } from "@..