Micro frontends and the multiverse of Frameworks

on YouTube ↗31m

" summary

Claim: combining Micro Frontends + Module Federation + Web components lets an Angular host load remote apps built in Angular (different versions), React, Vue, etc., on the same page. Implementation uses NX and webpack Module Federation, web components that bootstrap whole apps, a shared host library for analytics/feature flags, and custom events for cross‑framework state and routing. Demo shows components rendering, state updates and URL history syncing. Caveats: currently webpack‑centric and risk of global window collisions unless namespaced.

AI-written summary · about

" chapters (9)

1. 0:00Introduction
2. 0:33Micro frontends benefits
3. 5:06Webpack Module Federation
4. 7:36Web components encapsulation
5. 10:06Demo
6. 17:12Multi-framework integration
7. 21:08Code walkthrough
8. 28:30Limitations and future
9. 29:52Security and state

" related talks

• 36mMicro Frontends in Action!Peter Eijgermans · Voxxed Days Brussels 2023
• 25mAdvanced Micro Frontends: Multi-Version and Multi-Framework ScenariosManfred Steyer · WeAreDevelopers World Congress 2025
• 47mMicro Frontends UnmaskedManfred Steyer · Micro Frontends Conference 2024
• 47mMicro Frontend, Module Federation with Manfred SteyerManfred Steyer · JSWorld Conference USA 2021
• 38mThe Microfrontend Revolution: Using Webpack 5 Module Federation with AngularManfred Steyer · AngularNL 2020
• 45mMicro Frontends in Action!Peter Eijgermans · Voxxed Days Luxembourg 2023
• 30mFederated Angular: Micro Frontends with Module FederationManfred Steyer · JSWorld Conference 2021
• 32mBuilding a Multi-Framework Micro-Frontend App with Webpack5Sylvain Dedieu · Devoxx France 2022