The goal of this project was to figure out how Microfrontends work and if they would be a good fit for a project we were planning.

This POC pushed the microfrontend idea to it's limits by getting different libraries and frameworks - who are not designed to interop - to work together. And they did.

The idea is that you create a host app, and consume client apps using module federation. How this works is you expose a function in your app via a url, for example http://localhost:8081/remoteEntry.js can be consumed by the host, because it exposes a function that takes in a DOM node and attaches the app to that node. So the host calls the function and passes a dom node by reference, and the client attaches itself to the node.

Ultimately, we did not go with this solution since there are all sorts of complexities involved - such as state sharing between the MFE's in this context can be quite challenging, type safety goes out the window, and consistent styling will almost always prove to be a headache.

Repo 1