このページは PageTurner AI で翻訳されました（ベータ版）。プロジェクト公式の承認はありません。 エラーを見つけましたか？ 問題を報告 →
End-to-end typesafe APIs made easy
はじめに
tRPCはスキーマやコード生成なしで完全に型安全なAPIを構築・利用できるようにします。RESTとGraphQLのコンセプトを組み合わせたアプローチで、これらに慣れていない場合は主要なコンセプトをご覧ください。
フルスタックTypeScriptプロジェクトでは、クライアントとサーバー間でAPI契約を同期させることは共通の課題です。tRPCはTypeScriptの型推論を直接活用し、コード生成ステップなしでこれを実現し、ビルド時に問題を捕捉します。
tRPCはスタンドアロンで実行することも、豊富なアダプターのエコシステムを利用して既存のREST APIのエンドポイントとしてマウントすることも可能です。
特徴
-
✅ 十分にテストされ、本番環境での使用に耐える
-
🧙♂️ クライアント側での入力、出力、エラーに対する完全な静的型安全性とオートコンプリート
-
🐎 高速な開発者体験（Snappy DX） - コード生成、実行時の肥大化、ビルドパイプラインなし
-
🍃 軽量 - tRPCはランタイム依存関係がゼロで、クライアントサイドのフットプリントもごくわずかです。
-
🐻 新規・既存プロジェクト向け - 新規に始めるのも、既存のブラウンフィールドプロジェクトに追加するのも簡単
-
🔋 フレームワーク非依存 - tRPCコミュニティが主要なフレームワーク向けにアダプターを構築しています
-
🥃 サブスクリプション対応 - アプリケーションに型安全なリアルタイム更新を追加できます。
-
⚡️ リクエストのバッチ処理 - 同時に行われたリクエストを自動的に1つにまとめる
-
👀 例 - 学習用や開始点としてサンプルを確認してください
クイックビュー
詳細は動画とコミュニティリソースページをご覧ください。
tRPCを試す
-
最小限の例 — Node.js HTTPサーバー + クライアント
-
最小限のNext.js例 — 単一エンドポイント + ページ
またはローカルで始めるためにサンプルアプリを使用してください。
tRPCを採用する
新規プロジェクトを作成する
tRPCは様々なフレームワーク内で動作するため、まず使用環境を決める必要があります。
バックエンドでは、様々なフレームワークやバニラNode.js向けのアダプタがあります。フロントエンドでは、TanStack React QueryやNext.jsの統合、他のフレームワーク向けのサードパーティ統合、またはJavaScriptが動作する場所ならどこでも使えるVanilla Clientが利用可能です。
スタックを決めたら、テンプレートでアプリを構築するか、選択したバックエンド/フロントエンド統合のドキュメントを参照してゼロから始められます。
既存プロジェクトにtRPCを追加する
既存プロジェクトへのtRPC追加は新規プロジェクト作成と大きく変わらないため、同じリソースが適用できます。主な課題は、既存アプリケーションにtRPCを統合する方法が分かりづらい点です。ヒントをいくつか紹介します：
-
既存のバックエンドロジックをすべてtRPCに移植する必要はありません。一般的な移行戦略として、最初は新しいエンドポイントのみtRPCを使用し、既存エンドポイントは後で移行する方法があります。
-
どこから始めればよいかわからない場合は、バックエンドのアダプタとフロントエンド実装のドキュメント、およびサンプルアプリを参照してください。
-
大規模なコードベースでtRPCをどのように活用できるかの参考例が必要な場合は、tRPCを採用したオープンソースプロジェクトをご覧ください。
コミュニティ
質問や経験を共有するために、Discordに参加しましょう！