Micro-Frontend Architecture Demo

Next.js Shell orchestrating Angular & Svelte applications

Architecture Overview

S

Shell Application

Next.js 15 + React 19

Port: 3001

A

Angular MFE

Angular 20+ + TypeScript

Port: 4201

S

Svelte MFE

Svelte 4 + Vite

Port: 4173

Live Micro-Frontend Demonstrations

Angular Micro-Frontend

Dynamically loaded from http://localhost:4201

Svelte Micro-Frontend

Dynamically loaded from http://localhost:4173

Development Status

Shell Application: Running
Angular MFE: Ready
Svelte MFE: Ready

All micro-frontends are configured with Module Federation and ready for integration.