intermediate
Typing API responses, React, and Node services
Type external data, component props, events, handlers, service boundaries, and runtime validation.
Application TypeScript is strongest at boundaries: parse API responses from `unknown`, type React props and events explicitly where public, and model Node service inputs and outputs. Runtime validation complements static types because remote data can lie.
A generic `fetch<T>` that casts JSON to `T` is unsafe without validation. Shared backend/frontend types drift unless generated or validated at the boundary.
const data: unknown = await response.json();
const user = userSchema.parse(data);
On interviews: explain with a concrete example and name what interviewers probe in production code.
Common pitfalls: mixing similar APIs and forgetting edge cases during live coding.
The trade-off is often clarity versus safety or expressiveness versus maintainability. Checklist:
- Parse external data.
- Type public props.
- Avoid unsafe generic fetch casts.