Destructuring frontend monoliths with Microfrontends

on YouTube ↗58m

" summary

Claims a frontend monolith at Westwing is split into independently deployable pages (home, PLP, PDP, cart) using webpack 5 Module Federation so remotes load at runtime and shared libs aren’t duplicated. Communication uses custom DOM events across heterogeneous stacks. CI/CD uses a Tempurato template to bootstrap repos, Docker for local dev, assets on S3/CDN, and SSR remains possible. Result: parallel team velocity increases and deployments decouple; UI consistency enforced with a shared UI kit.

AI-written summary · about

" chapters (5)

1. 0:00Start
2. 8:29Appshell
3. 10:29COMMUNICATION
4. 16:14Host config
5. 24:48Templating engine Tenpureto

" related talks

• 31mMicro frontends and the multiverse of FrameworksAdrian Iskandar Espinosa Caballero · ng-conf 2022
• 31mMigrating from Monolith to MicrofrontendsYaprak Ayazoglu · ConfrontJS 2018
• 47mMicro Frontend, Module Federation with Manfred SteyerManfred Steyer · JSWorld Conference USA 2021
• 22mRoad to Module FederationSumit Arora, Abdella Ali · ng-conf 2023
• 41mThe Microfrontend RevolutionManfred Steyer · angularday 2020
• 21mAngular based Micro frontends with module federationManfred Steyer · ng-conf 2022
• 36mFearless Microfrontends: Angular and Native Federation in ActionDavide Senatore · angularday 2025
• 38mThe Microfrontend Revolution: Using Webpack 5 Module Federation with AngularManfred Steyer · AngularNL 2020