Frontend Architect
Frontend Architects define the structural decisions that shape large-scale web products. They write Architecture Decision Records, champion performance budgets across teams, and facilitate design-system adoption. This path covers the precise English needed for presenting module-federation strategies, writing compelling ADRs, and leading cross-functional technical discussions.
Topics covered
- Micro-frontend Architecture
- Module Federation
- Design Systems
- Core Web Vitals & Performance Budgets
- Architecture Decision Records
- Governance & RFC Writing
Vocabulary spotlight
4 terms every Frontend Architect should know in English:
An architectural pattern that decomposes a frontend application into independently deployable units owned by separate teams
"Each squad owns a micro-frontend that is composed at runtime via Module Federation."
A defined set of limits for metrics such as bundle size, Time to Interactive, and Lighthouse score that a build must not exceed
"The CI pipeline fails if any route exceeds the 200 KB JavaScript performance budget."
To expose or consume a module across independently built and deployed applications using Module Federation
"The checkout team federates their cart component so that three other apps can consume it."
Representing the single authoritative source or reference implementation within a system
"The design system provides the canonical Button component that all teams must use."
📚 Vocabulary Reference
Key terms organised by category for Frontend Architects:
Micro-frontend Concepts
Design System Language
Performance & Metrics
Architecture & Governance
Recommended exercises
Real-world scenarios you'll practise
- Writing an Architecture Decision Record to justify adopting Module Federation.
- Presenting a design-system governance model to product and engineering leads.
- Facilitating a cross-team RFC review for migrating to a micro-frontend topology.
- Reporting Core Web Vitals regressions and proposed remediation to stakeholders.