search

module-federation / module-federation-examples

Implementation examples of module federation , by the creators of module federation
https://module-federation.io/
MIT License
5.66k stars 1.75k forks source link

Memory router in microApp #3163

Open nikhil2kumar opened 1 year ago

nikhil2kumar commented 1 year ago

Hi,

We have just started with micro frontend implementation and have followed the steps mentioned in this article. I also went through some other resources and all suggested the same approach.

I have one doubt though. Can we not send the parent's history object to the microApp and let microApp update it?

` import {Router} from 'react-router-dom';

`

ftvalex01 commented 3 weeks ago

you could pass the parent’s history object to a micro-frontend so it can update navigation directly, but it’s usually not the best approach.

The main reason is that micro-frontends are supposed to stay isolated. Think of each micro-app as its own little worl it should manage its own routing so that changes in one don’t accidentally affect others. If each micro-frontend starts modifying the parent’s history, it can get messy fast, especially with navigation conflicts when multiple micro-apps are loaded at the same time.

Instead, it’s generally smoother to have each micro-frontend handle its own routing internally using something like MemoryRouter. This keeps everything nice and separated, making it easier to maintain and avoiding any unexpected issues down the line. The shell app can still manage overall navigation between micro-frontends as needed, keeping everything in sync without those conflicts.