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.