Shared Redux Store in Next.js Module Federation: Cross-Remote State

// Auth React remote dispatches:
dispatch(setIsLoggedIn({ isLoggedIn: true }))

// Products Next.js remote reads:
const isLoggedIn = useAppSelector(selectIsLoggedIn)
// → returns FALSE

Enter fullscreen mode Exit fullscreen mode

You log in. Cart still says you didn't.

If you've built a hybrid micro frontend with React remotes (ModuleFederationPlugin) loaded inside a Next.js host (NextFederationPlugin), you have either hit this bug or you will. Open Redux DevTools and you'll see two store instances — one created by the Auth remote, one created by Products. Each remote dispatched into its own copy.

The contract that fixes it

A federated Redux singleton. One @myapp/store package. The host imports it once, creates the store, wraps the app in `. Every remote importsuseSelectoranduseDispatch` from that same package, and Module Federation guarantees they all receive the host's instance — not a fresh one.

What the article covers

• Complete @myapp/store package code — configureStore, slices, re-exported react-redux primitives
• ClientReduxProvider + ssr: false — why importing the store at the top of _app.tsx crashes the server build
• The shared block in host next.config.js and every remote (webpack.config.js for React, next.config.js for Next.js) — singleton + strictVersion contract
• 5-step Module Federation runtime negotiation — register, dynamic import, version match, reuse
• Real codebase examples — Auth (React) dispatching setIsLoggedIn, Products (Next.js) reading selectAccessToken
• Why each remote keeps its own ClientReduxProvider — for standalone dev only
• SSR + federated Redux hydration trap — skip SSR for federated state, hydrate on client mount
• 7 gotchas that account for almost every "state is not propagating" bug
• State decision matrix — federated store vs local useState vs URL search params vs TanStack Query

The one debug step that solves 80% of these bugs

Open Redux DevTools. Count the stores. If there is more than one, the singleton negotiation has failed and your shared block has a typo or a missing singleton: true somewhere. Fix that first. Everything else is a waste of time until there is exactly one store in DevTools regardless of how many remotes are mounted.

Read the full guide with code examples → Shared Redux Store in Next.js Module Federation Guide