0PricingLogin
React Academy · Lesson

Sharing State and Routing Between Remotes

Share a single React Router instance and Zustand store across independently deployed micro-frontends.

The State Sharing Challenge

Each Module Federation remote is an independently built and deployed application. Its state (React useState, Context, Zustand stores) lives in its own JavaScript module scope. The host and remotes don't automatically share state — you must architect the sharing explicitly.

Option 1: URL as Shared State

The simplest state sharing mechanism is the URL: any remote can read URL params, query strings, and hash values without any cross-remote communication. This works well for primary navigation state, filter values, and any state that should be bookmarkable and shareable via link.

All lessons in this course

  1. Module Federation: Dynamic Runtime Imports
  2. Configuring Host and Remote React Apps
  3. Sharing State and Routing Between Remotes
  4. Versioning, Deployment, and Orchestration
← Back to React Academy