Lesson 04 · React
Capstone — A Component-Driven Interface
Assemble the module into a working Study Tracker: requirements to components, components to state, static structure first, then wired interactions, derived stats and a design self-review.
Prerequisites: Effects, Lists & Forms
Learning objectives
By the end of this lesson, you will be able to:
- Break a mockup into a component tree where each piece has one job
- Design minimal state: what changes, what is derived, and where each value lives
- Build a component-driven interface in stages - static structure first, then wired interactions
- Assemble props, controlled forms, immutable updates and derived values into one working app