Return to the library

Foundation curriculum

Frontend

Frontend engineering turns documents, styles, scripts, and data into interfaces people can use. This path starts with the browser, then builds toward framework choices and production tradeoffs.

Recommended sequence

Learn what the browser does first.

A framework can organize components and updates, but its component tree is not the DOM and its render step is not the browser's paint step. The sequence below separates those responsibilities before examining how applications use them.

Open the frontend learning path
Published
3 browser-foundation lessons are ready to read.
Planned
The remaining 7 topics have no article routes yet.
Approach
Browser behavior first; React and other frameworks only as examples of the underlying model.

Published and planned

Ten concepts in learning order

  1. How Browsers Turn HTML and CSS Into PixelsRead lesson →
  2. The DOM, Events, and User InteractionRead lesson →
  3. The JavaScript Runtime, Event Loop, and Async CodeRead lesson →
  4. CSS Layout and Responsive InterfacesPlanned · not yet published
  5. Components, State, and RenderingPlanned · not yet published
  6. Data Fetching, Loading, Errors, and CachingPlanned · not yet published
  7. CSR, SSR, SSG, Hydration, and Server ComponentsPlanned · not yet published
  8. Same-Origin, CORS, XSS, and Browser Security BoundariesPlanned · not yet published
  9. Bundles, Code Splitting, and Frontend PerformancePlanned · not yet published
  10. Semantic HTML and AccessibilityPlanned · not yet published

Published lessons are links. Planned lessons are deliberately not clickable.

Connected foundations

Useful before you begin

You do not need to finish the web-application path first. These lessons give useful context when browser behavior meets the network and backend: