How to Prepare Production with Webpack 5 Module Federation
summary
Practical guidance on taking Webpack 5 Module Federation into production when splitting a monolithic app into microservices/micro-frontends. Covers configuring deployment and operations (Nginx, Docker, Kubernetes, CI/CD), handling shared libraries and React contexts, and describes real-world pitfalls encountered during the team's rollout.
AI-written summary · about
chapters (22)
- 0:00Introduction
- 2:38Monolith problems
- 7:56Micro-frontends & monorepo
- 9:21Webpack 5 Module Federation
- 12:54Connecting micro-frontends
- 15:26Manual scripts drawbacks
- 17:39Micro-frontends vs lazy loading
- 20:53Common MF mistakes
- 24:09Animating lazy components
- 27:40Reusing dependencies
- 31:36MF deployment
- 36:17Tech stack & infra
- 38:26Static loading in cloud
- 41:18Nginx proxy setup
- 45:17Nginx env variables
- 47:28Port exposure fixes
- 48:56Versioning & dynamic resolving
- 51:26User request flow
- 52:48Deployment & update
- 53:50Caching & invalidation
- 54:12Migration summary
- 55:43Q&A
related talks
51mBuilding a Micro-Frontend Application with Webpack 5 Module Federation
01h 13mThe Microfrontend Revolution, module federation, Webpack 5
01h 02mWebpack 5 Module Federation
28mModule Federation: Theory vs Practice
31mModule Federation in Webpack 5
29mHow module federstion makes our life easier
32mBuilding a Multi-Framework Micro-Frontend App with Webpack5
21mMicro Frontends Made Easy with Module Federation