React with TypeScript
Rebuild Harbor Together as an accessible event explorer. Learn why components render, which values need state, and how to handle uncertain data without pretending a local demo is a real service.
Start after the companion HTML/CSS and Basic JavaScript courses. This course introduces TypeScript, npm and React; it assumes you already understand browser forms, objects, modules and promises.
Your learning route
Set up a repeatable React workspace
Describe UI with components and props
Model trustworthy event data
Connect interactions to state
Keep identity through changing lists
Build an honest accessible practice form
Synchronize with browser systems
Handle remote-shaped data locally
Give screens meaningful URLs
Test behavior and prepare a build
Check understanding
- After lesson 05: rendering, types and state
- After lesson 08: forms, effects and async work
- After lesson 10: navigation and release evidence
Build independently
Capstone brief and 30-point rubric · Learner starter
The starter runs but its acceptance tests begin red. Implement your own model and UI, add tests, and explain the result before opening the separate reference walkthrough linked from the brief.
Evidence and boundaries
All events and form values are fictional. Nothing is submitted or published. Exact package versions, tests and remaining checks are documented; passing code checks does not certify browser accessibility.