Aabha · Frontend foundations

React with TypeScript · Harbor Together

Practice 03 · Data boundaries

A. Predict the parser

Read shared/domain.ts and checkpoint 03. Predict the result for each input: an empty array; an object containing an events array; two valid records with the same ID; a record with places=-1; a record dated 2026-02-31. Then run controlled experiments in a copy or small test. Distinguish a valid empty result from rejected data.

B. Repair a false guarantee

A loader says const events = await response.json() as CommunityEvent[];. Its author claims this guarantees titles are strings. Explain the error and sketch the correct boundary using unknown and parseEvents. Include a malformed-JSON case and a valid-JSON/wrong-shape case in your evidence.

C. Transfer

Extend a copied event model with an optional durationMinutes field. When present it must be an integer from 15 through 240; when absent the UI should say “Duration not supplied.” Implement both static type and runtime validation. Test absent, 15, 240, 14, 241, a fractional number and the string “30”. Do not change the original fixtures required by other checkpoints.

Completion evidence: predictions checked, boundary explanation, extension code and seven cases. Separate solutions.