How to Build Micro Frontends in React with Vite and Module Federation
Aug 26, 2025 · 15 min read · Micro Frontend Architecture has become increasingly popular in recent years, as teams look to re-use parts of their existing applications in new projects rather than rebuilding everything from scratch. Micro frontends also allow large teams to share ...
Join discussion
Exploring micro-frontends: why, when & how (and why I'm doing it anyway)
Jun 8, 2025 · 3 min read · “A path is whatever you make of it—as long as it gets you where you want to go.” — Carl Eubanks, 2025 Step back and see the big picture I always start with why. Call it a ritual: three deep breaths, zoom the camera out, and ask whether the work in ...
Join discussion
Effortless Dynamic Module Loading with Module Federation V2 in React
May 12, 2025 · 5 min read · Module Federation V2 (MFv2) brings new runtime APIs and improved share‑scope handling to the micro‑frontend ecosystem. In this post, we’ll build a minimal React host and remote using the @module-federation/enhanced runtime, show full example code, an...
Join discussion
🛠️ Implementing Shared State in Angular Micro Frontends using NgRx + Module Federation
Mar 11, 2025 · 3 min read · In a Micro Frontend (MFE) architecture, each app runs independently, but sometimes we need to share state between them (e.g., authentication, user preferences, cart data in an e-commerce app).✅ We will use NgRx (Redux for Angular) to manage state acr...
Join discussion
🔥 Persisting Shared State in Angular Micro Frontends (MFEs) using NgRx + localStorage
Mar 11, 2025 · 2 min read · When using NgRx across Micro Frontends, the state resets on page reload because it's stored in memory.✅ To persist the state across reloads, we’ll use localStorage with NgRx MetaReducers. 📌 Step 1: Create a MetaReducer to Sync State with localStora...
Join discussion
🔗 Angular Micro Frontends with Module Federation: How Closures Enable Dynamic Loading
Mar 11, 2025 · 3 min read · Let's deep dive into implementing Angular Micro Frontends (MFEs) with Module Federation, focusing on how closures help isolate modules and dynamically load remote components. 1️⃣ What is Module Federation in Angular? Module Federation, introduced in...
Join discussion
Taming the Beast: Mastering Micro-Frontends with Webpack Module Federation & Next.js
Jan 28, 2025 · 4 min read · Introduction: Why Micro-Frontends Matter Now Modern web apps are evolving into sprawling ecosystems. Monolithic React codebases buckle under the weight of feature creep, conflicting team priorities, and deployment bottlenecks. Enter micro-frontends—a...
Join discussion
🍒 Cherry-Picked Nx v19.6 Updates
Aug 15, 2024 · 5 min read · 🌊 Nx Core Skipping Dependent Tasks When testing or for any other reason, you may want to skip running the entire tree of task dependencies. You can now achieve this with the --exclude-task-dependencies flag in your Nx command: nx run app:build --exc...
Join discussion
Module Federation 장단점
Jul 11, 2024 · 1 min read · 장점: 빌드 단위의 세분화: Module Federation을 사용하면 빌드 단위가 페이지 전체에서 페이지 내의 특정 블록(부분)으로 세분화됩니다. 이는 코드의 재사용성을 높이고, 독립적인 개발 및 배포를 가능하게 합니다. 특히, 큰 프로젝트에서는 이러한 세분화가 유용하게 작용할 수 있습니다. 단점: SSR의 러닝 커브: 서버 사이드 렌더링(SSR)과 Module Federation을 함께 사용하려면 추가적인 설정과 이해가 필요합니다. 이...
Join discussion