Skip to content

hanford/bi-directional-mfe

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

8 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Webpack 5 Microfrontend, Relay hooks, React Suspense

preview gif

This example demos bi-directional hosts each with their own remote components. We're sharing data aware components that use react suspense and relay hooks.

  • app1 exposes a <Profile /> component.
  • app2 exposes a <Feed /> component, built with Modal from app3
  • app3 exposes a <Modal /> component.
  • app4 consumes app1, app2, app5, app6 exposed components, it also shares a router and composes routes from app6
  • app5 exposes a <About /> component.
  • app6 exposes it's router, with <TermsOfService /> and Privacy components.
  • server is a shimmed graphql server.

Running Demo

Run yarn start. This will build and serve both app1, app2 and app3 on ports 3001, 3002 and 3003 respectively. It will also start the graphql server.

Inspiration

About

Webpack 5 Microfrontend, with Relay hooks and React Suspense

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published