코드 생성 없이 타입 안전한 API 클라이언트 만들기

API 응답에 as User를 사용하는 것을 중단하세요.

as User 캐스팅은 컴파일러에게 하는 거짓말입니다. TypeScript는 데이터가 올바르다고 생각합니다. 하지만 런타임에서 데이터는 종종 틀려 있습니다. 버그는 세 단계 뒤의 함수에서 나타납니다. 스택 트레이스(stack trace)는 도움이 되지 않습니다.

네트워크는 아무것도 믿어서는 안 되는 곳입니다. 경계(boundary)에서 데이터를 검증하세요.

Zod를 사용하세요. 스키마를 한 번만 정의하세요. Zod는 타입과 검증 기능을 동시에 제공합니다. 타입이 어긋나는 일이 없을 것입니다.

간단한 fetch 래퍼(wrapper)를 만드세요. 여기에 스키마를 전달하세요. safeParse를 사용하여 바디를 확인하세요. 데이터는 검증을 거친 후에야 비로소 타입이 됩니다.

에러를 던지지(throw) 마세요. Result 객체를 반환하세요. ok: true 또는 ok: false를 사용하는 유니온(union) 타입을 사용하세요. 이렇게 하면 실패 상황을 반드시 처리하도록 강제할 수 있습니다.

동일한 로직을 URL에도 적용하세요. 쿼리 파라미터에도 스키마를 적용하세요. 요청이 나가기 전에 오타를 방지하세요.

다음과 같은 경우 Zod를 사용하세요:

  • 엔드포인트가 적을 때.
  • OpenAPI 명세(spec)가 없을 때.
  • 런타임 안전성을 원할 때.

다음과 같은 경우 codegen을 사용하세요:

  • 엔드포인트가 수백 개일 때.
  • 완벽한 명세가 있을 때.

캐스팅은 검증이 아닙니다. fetch 근처의 as User는 코드 스멜(code smell)로 간주하세요.

경계에서 파싱하세요. 내부에서는 믿으세요.

출처: https://dev.to/pavelespitia/type-safe-api-clients-in-typescript-without-a-code-generator-1k32