Aabha · Frontend foundations

React with TypeScript · Harbor Together

Dated source register

All 38 primary reference pages below were opened and checked on 2026-10-14. They support the technical model; lesson narratives, examples, tasks and diagrams are newly authored for this course. No documentation chapter, source-site screenshot or third-party illustration is reproduced. Links may change after this check.

  1. React quick start — Overall terminology and UI scope; original examples used throughout.

  2. React with TypeScript — TSX, typed props, event and hook annotations; lessons 01–06.

  3. Your first component — Component names, definitions and composition; 01–02.

  4. Passing props — Input contracts and composition; 02.

  5. Keeping components pure — Pure rendering and avoiding mutations; 02–04.

  6. Render and commit — Render descriptions versus DOM commits; 01–02.

  7. State as a snapshot — Event/render snapshots; 04.

  8. Queueing state updates — Functional updater reasoning; 04.

  9. Choosing state structure — Derived results and avoiding duplicated records; 04–05.

  10. Rendering lists — Stable record keys; 05.

  11. Preserving and resetting state — Position, keys and unmounting; 05, 09.

  12. React input reference — Controlled inputs and constraint behavior; 06.

  13. useId — Unique label/error associations, not list keys; 06.

  14. useRef — Targeted DOM focus and nullable refs; 06, 09.

  15. You might not need an effect — Render/event/effect distinction; 04, 07.

  16. Synchronizing with effects — External relationships and cleanup; 07–08.

  17. useEffect reference — Dependencies, async cleanup and obsolete work; 07–08.

  18. Strict Mode — Development setup/cleanup and purity checks; 01, 07.

  19. TypeScript everyday types — Object/union/optional types and assertions; 03.

  20. TypeScript narrowing — Unknown values, guards and discriminated unions; 03, 08.

  21. TypeScript indexed access — Reading the category vocabulary type; 03.

  22. TypeScript utility types — Partial and Record in error models; 06.

  23. TypeScript strict option — Strict source contracts; 01.

  24. Vite setup — Development setup and runtime requirements; 01.

  25. Vite production builds — Static build entries and assets; 10.

  26. Vite static deployment — Preview scope and hosting concepts; 10. No deployment performed.

  27. Vitest getting started — Test runner setup; 10.

  28. Vitest environments — Simulated DOM scope; 10.

  29. React Testing Library — Behavior-oriented UI tests; 10.

  30. Testing Library queries — Role/name queries and get/query/find distinctions; 10.

  31. user-event introduction — Interaction setup and awaiting actions; 10.

  32. React Router declarative installation — Focused client routing setup; 09.

  33. React Router declarative routing — Routes, dynamic segments and links; 09.

  34. HashRouter reference — Fragment-based routing; 09.

  35. MDN using Fetch — HTTP/body parsing and abort boundaries; 08.

  36. MDN localStorage — Origin scope, string data and failure behavior; 07.

  37. WAI form notifications — Useful errors, associations and feedback; 06.

  38. Node releases — LTS release context and runtime selection; 01.

Exact dependency evidence

Package versions and engine/peer requirements were read from the official npm registry using npm view on 2026-10-14, then installed and checked against package-lock.json. See version register and the reproducible machine-readable registry evidence. Documentation banners and package registry versions serve different purposes; package pins come from registry evidence, not guessed documentation version labels.

Source and asset rights

Original SVGs are listed with descriptions in asset register. External sources retain their own terms and licenses; this package links to them rather than republishing their documentation. The learner ZIP contains authored source and a lockfile, not node_modules or a bundled third-party distribution. Installed packages carry their own licenses. Their declared license metadata is recorded in LICENSES.md.