Architecture is the set of decisions that are expensive to change: where code lives and what may import what, how it is built and shipped, how it is tested and observed, and who owns which part. A frontend that works at ten thousand users and dies at a million usually died of one of those decisions, made early and never revisited.
This course is those decisions, each with the mechanism it rests on and the number that breaks it. Repo structure and boundaries first, then the build pipeline from source to a cached byte on a CDN, a testing strategy that admits where the pyramid lies, observability that tells you what users saw, the shapes of a frontend at scale, and then three parts on what breaks at each order of magnitude: bundles and caches and state at a hundred thousand, the edge and devices and flags at a million, the long tail and WebViews and release trains at a hundred million.
boundariesRepo structure, feature-sliced design, dependency rules enforced by tooling, and the public surface of a module.
the pipelineBundlers, code splitting, tree shaking, source maps, content hashing, caching, and the CI gates that keep a build honest.
testingThe pyramid and where it lies, contract tests at the seams, E2E that stays green, and the budget for each.
observabilityErrors with context, metrics with attribution, traces across the client and the API, and the sampling that pays for it.
scale shapesMonorepos, microfrontends and module federation, design-system distribution, ownership and the cost of each.
100kBundle growth, cache hit rates, state sprawl, flaky tests: the first things that break.
1MCDN and the edge, real-device performance, i18n, feature flags and rollout, the support load.
100MThe long tail of devices, WebViews and hybrid shells, experimentation at scale, release trains, incident response for a client you cannot roll back.
Reading this courseEach part names a decision, the mechanism under it, the number that breaks it, and what the next order of magnitude does to it. The three "what breaks" parts are written as incident logs with the fix that followed.