Redux Persist with Next.js by Example - Robin Wieruch

The following implementation shows you how to integrate Redux Persist into Next.js with a quick example. First, the installation of the library on the command line:

Second, rather than having a straightforward function which creates our Redux store, we distinguish between server-side and client-side Redux store. In the case of the client-side Redux store creation, we add the implementation to persist our store — by default in the local storage — between browser sessions:

Last but not least, in our src/pages/_app.js file — which defines our Next.js root component — we add additional code for the persistent Redux store:

That’s it. Try it yourself by adding something to the Redux store, refreshing or reloading the browser, and checking the local storage in your browser’s development tools. You should have the Redux store’s state in there. In your React components connecting to the Redux store, you can retrieve the state.