← Back to Skills
Software EngineeringEngineeringPlatinum

Split a React app into independently deployable parts for multiple teams.

React Micro-Frontend Architect

React, Module Federation, single-spa

expertv5.0

Best for

  • Decompose React monoliths into independently deployable micro-frontends using Module Federation
  • Design runtime composition strategies for multi-team React applications with shared state management
  • Implement single-spa orchestration for mixed technology stacks (React + Vue + Angular)
  • Architect Next.js Multi-Zones for server-side composed micro-frontend applications

What you'll get

  • Webpack Module Federation configuration with host/remote topology, shared dependency strategies, and error boundary patterns
  • Team responsibility matrix mapping micro-frontends to autonomous teams with deployment pipeline designs
  • Shared state management architecture using context bridges, event buses, and cross-application communication patterns
Expects

Clear description of team structure, deployment bottlenecks, technology constraints, and specific organizational scaling challenges requiring independent frontend deployments.

Returns

Detailed micro-frontend architecture blueprint with composition pattern selection, Module Federation configuration, shared state strategy, and team autonomy implementation plan.

What's inside

You are a React Micro-Frontend Architect. You design and operate independently deployable React applications that enable autonomous team delivery while preserving cohesive user experiences. - **Validate organizational fit first**: Micro-frontends solve team autonomy problems, not technical ones. You...

Covers

What You Do DifferentlyMethodologyWatch ForOutput Format Format
Not designed for ↓
  • ×Single-team React applications where a monorepo would be simpler and faster
  • ×Backend microservices architecture or API gateway design
  • ×Component library development without independent deployment requirements
  • ×Static site generation or basic React application setup

SupaScore

88.53
Research Quality (15%)
9.1
Prompt Engineering (25%)
9
Practical Utility (15%)
8.65
Completeness (10%)
8.75
User Satisfaction (20%)
8.8
Decision Usefulness (15%)
8.7

Evidence Policy

Standard: no explicit evidence policy.

micro-frontendsmodule-federationreactsingle-spawebpackfrontend-architectureindependent-deploymentdesign-systemmonolith-decompositionteam-autonomyruntime-composition

Research Foundation: 7 sources (3 official docs, 2 industry frameworks, 1 web, 1 books)

This skill was developed through independent research and synthesis. SupaSkills is not affiliated with or endorsed by any cited author or organisation.

Version History

v5.03/25/2026

v5.5 distilled from v2 via Claude Sonnet

v2.02/26/2026

Pipeline v4: rebuilt with 3 helper skills

v1.0.02/16/2026

Initial release

Works well with

Need more depth?

Specialist skills that go deeper in areas this skill touches.

Common Workflows

Monolith Decomposition to Micro-Frontend

Complete transformation from React monolith to federated architecture with design consistency and monitoring

react-micro-frontend-architectDesign System ArchitectFrontend Observability Engineer

© 2026 Kill The Dragon GmbH. This skill and its system prompt are protected by copyright. Unauthorised redistribution is prohibited. Terms of Service · Legal Notice