Micro Frontends Conference

Overview
The MFE solutioning started with breaking a monolith frontend application that was being maintained by multiple teams, this had a significant impact on the lead time for independent/isolated features. A solution was needed which could result in independent, isolated business apps that can be reused across multiple host applications(known hereon as a composer application).

We started by leveraging the vue-router and rollup to export a version-controlled UMD bundle that houses an entire SPA with a routing of its own. This bundled UMD will be mounted and rendered in various composer applications.

Next, we enabled 2-way communication between the MFE and the composer application(within peers as well) by creating a basic event bus.

Lastly, all being lego-ed up and running was to plug in the system to a CI/CD which completes the lifecycle.
This was how Livspace was able to host multiple SPAs, maintained by independent business teams within the same composer application.

Limitations
Works for the VueJS ecosystem.

Takeaways

1. Journey to MFE as a hybrid approach to monolith applications.
2. How MFE changed high impact deliveries.
3. Communication in MFEs
4. Devops for MFEs

Link
MFE Presentation

Author
Rohit Kumar is a Software Engineer here at Livspace and has been key in transforming MFEs from ideation to action.