React Module Federation

React module federation demo.

Libraries

• Webpack v5.44.0
• React v17.0.2+
• TypeScript
• ImmerJs
• React Router
• Redux
• Redux-Observable
• Redux-thunk
• Axios
• Babel

Feature

• Include Jwt demo
• Support redux-thunk
• Support redux-observable
• Support dynamic inject redux store
• Support dynamic inject redux-observable
• Support GraphQL
• Support mutilple api server
• Support local api with json
• Support generate template code
• Support husky

Project directory

host

It's the top-level app, which depends on react-client , react-client-login, react-client-epic, graphql-client.

I think we should put the state and function what will be shared code in the top-level app. (like Auth and Router)

react-client (Container)

It's the low-level app, shared the home container for the host.

react-client-login (Container)

It's the low-level app, shared the login container for the host, after login suceess will redirect to the react-client home container.

react-client-epic (Container)

It's the low-level app, shared the epic container for the host. (Show you how to inject into redux-observable)

graphql-client (Component)

It's the low-level app, shared the graphQL component for the host.

How to use

• npx lerna bootstrap
• ext install fabiospampinato.vscode-terminals
• Press ⇧⌘P and type Terminals: Run