클라이언트 개요

tRPC API는 다른 REST API와 마찬가지로 일반적인 HTTP 요청을 통해 호출할 수 있지만, tRPC의 타입 안전성을 활용하려면 클라이언트가 필요합니다.

클라이언트는 API에서 사용할 수 있는 프로시저와 각 프로시저의 입력 및 출력을 파악합니다. 이 정보를 활용해 쿼리와 뮤테이션에 자동완성을 제공하고 반환 데이터의 타입을 정확히 지정하며, 백엔드 구조와 일치하지 않는 요청에는 오류를 표시합니다.

React에서는 TanStack React Query 통합으로 tRPC API를 호출하는 방식을 권장합니다. 이 통합은 타입 안전한 API 호출뿐 아니라 캐싱, 무효화, 로딩 및 오류 상태 관리도 제공합니다. Next.js의 /pages 디렉터리를 사용한다면 서버 사이드 렌더링과 정적 생성을 위한 헬퍼를 제공하는 Next.js 통합을 사용할 수 있습니다.

다른 서버에서 tRPC API를 호출하거나, 통합이 제공되지 않는 프론트엔드 프레임워크에서 호출하려면 Vanilla Client를 사용할 수 있습니다.

React 및 Next.js 통합과 Vanilla Client 외에도 다양한 커뮤니티에서 구축한 다른 프레임워크용 통합이 있습니다. 이러한 통합은 tRPC 팀에서 유지 관리하지 않는다는 점에 유의하세요.