Micro-Frontend Architecture Platform
This project demonstrates a modern micro-frontend architecture where a React based platform container integrates multiple independent applications built with Next.js. Each application runs independently while still being embedded inside the platform using iframe integration.
System Architecture
The platform container is built using React and acts as the application shell. Independent applications such as the Events and Pricing modules are built with Next.js and embedded using iframe based micro-frontend integration. Each module can run standalone or inside the platform container.
Architecture Principles
Independent Deployment
Each micro-frontend is deployed separately allowing faster development cycles and isolated updates.
Scalable Platform
New applications can easily be added without modifying the core platform architecture.
Shared Data Layer
Both Events and Pricing applications store their data in Airtable creating a unified data source.
Standalone Applications
Each module can run independently or be embedded within the main platform.
Admin Dashboard & Analytics
The platform includes an admin dashboard that visualizes activity across all micro-frontend applications. Event registrations and subscription selections are stored in Airtable and used to generate analytics insights.
Event Registrations
Email registrations submitted from the Events application are stored and monitored by the admin panel.
Plan Subscriptions
User plan selections from the Pricing module are stored and used to analyze subscription patterns.
Centralized Data
All platform activity is aggregated into a single Airtable database for easier reporting.
Platform Monitoring
The dashboard provides insights into platform performance and user engagement.