React MFE Shell Demo
Interactive demo application for the React MFE Shell design system with PWA support, automated metrics, and component showcase.
What it is
An interactive demo application showcasing all components from the React MFE Shell design system. Includes PWA support, automated metrics, and a complete showcase of atomic and molecular components.
Available as a live demo and as source code.
Features
- Complete showcase — all atomic and molecular components in action
- PWA — works offline with service worker
- Real-time metrics — bundle, test, and coverage statistics
- Themes — light and dark mode switching demonstration
- Release-please — automated versioning
Why it matters
Demonstrates how to document a design system with an interactive application instead of static documentation. Automated metrics ensure displayed data always reflects the actual package state.
References
- Live Demo — jonmatum, 2025. Interactive showcase.
- GitHub Repository — jonmatum, 2025. Source code.
Related content
- Monorepos
Code organization strategy where multiple projects coexist in a single repository, sharing dependencies, configuration, and build tooling.
- Micro Frontends
Architectural pattern extending microservices to the frontend, allowing independent teams to develop and deploy parts of a web application autonomously.
- React
JavaScript library for building user interfaces through declarative, reusable components, with an ecosystem spanning from SPAs to full-stack applications with Server Components.