5 micro-topics in Web Interface, each with the evidence that proves you have it and the written reason behind every link. Before you start, it rests on 2 other domains. Downstream, it holds up 3 domains.
5 topics · depth 5–8 of 16 · 4 internal links · 5 in · 7 out
Load-bearing links first. Each one says what in this domain rests on what outside it, and why.
4 links
Compose components rests on Write and call functions
A component is a function that returns markup.
Synchronize with effects rests on Write async and await
Fetching inside an effect is asynchronous.
Handle errors at component boundaries rests on Handle errors
Boundaries handle thrown errors.
Manage component state rests on Use closures
Hook behavior makes more sense once closures do.
1 link
Compose components rests on Choose semantic elements
Components return markup you must be able to write.
In prerequisite order. Each idea names the artifact that closes it, the market demand that put it on the map, and what it stands on.
Depth 5 · conceptual · unassisted · M10 §10.2
Splits UI into functions that return markup
Write and call functions · JavaScript Core
A component is a function that returns markup.
Choose semantic elements · HTML & Semantic Markup
Components return markup you must be able to write.
Depth 6 · conceptual · unassisted · M10 §10.2
Moves data down a tree explicitly
Props are the arguments to a component.
Depth 6 · conceptual · scaffolded · M09 §9.6
Catches render failures without blanking the app
A boundary is a component that catches its children's failures.
Handle errors · JavaScript Core
Boundaries handle thrown errors.
Depth 7 · conceptual · unassisted · M10 §10.2
Holds and updates state with hooks
State is what props cannot express.
Use closures · JavaScript Core
Hook behavior makes more sense once closures do.
Depth 8 · conceptual · scaffolded · M10 §10.3
Runs and cleans up side effects
Effects synchronize state you already hold.
Write async and await · JavaScript Core
Fetching inside an effect is asynchronous.
Everything downstream that names an idea here as a prerequisite, grouped by where it lives.
4 links
Route with the file system rests on Compose components
Routes render components.
Handle loading and error states rests on Handle errors at component boundaries
Route error states are boundaries.
Stream UI with Suspense rests on Compose components
Suspense boundaries are components.
Choose server or client components rests on Synchronize with effects
Knowing what client effects cost clarifies where the boundary belongs.
2 links
Render streamed output progressively rests on Manage component state
Progressive rendering updates state on every chunk.
Manage conversation history in the UI rests on Manage component state
History is state.
1 link
Test components as a user would rests on Compose components
You test components.
Retool. Retrain. Relaunch.
375 ideas. 17 weeks. No tuition, ever.
Vets Who Code is a veteran-run 501(c)(3). The accelerator is free, remote, and we don’t take a share of your first paycheck.
Free · Remote · 17 weeks · EIN 86-2122804