記事

tRPCとHonoとReactとViteの組み合わせが最高すぎた

バックエンド駆動開発ができて最高に楽しい

  • 型がパチパチとハマる体験がすごくいい
  • Swaggerをちゃんと書かないとフロントエンドで型の漏れやメンテなどが億劫になっていたが、それもなく使えるのが最高

これまでFetchなどでAPI通信をしていた人

  • tRPCで使うにあたって最低限しておくこと
    • queryはGETに相当する
    • mutationはPOST/PUT/DELETEに相当する
    • subscriptionはwebsocketに相当する

inputが入力にschemaに該当する
返り値はどこに書くの?

  • 基本的に自動推論される
  • 明示的に書きたかったら、outputを書けばいい

あとはContextの持ち方をわかれば完璧かな

TanStack StartでReactでもファイルベースのルーティングができるようになれば完璧

これをいい感じにDeployするIaCさえできたら最高だな

  • これからの個人開発はこれでしたい感ある
  • Next.jsはいらないかも

tRPCとReactとHonoではじめる個人開発テンプレート

  • Hono RPCを使わずにtRPCを使うのはなんか理由があるの?
    • フロントエンドでTanstack RoutetやQueryを使うときにtRPCで統一している方が楽かな?って
    • Hono RPCでもいいとは思うよ
    • https://github.com/honojs/middleware/tree/main/packages/trpc-server
      • Hono RPCはただのtRPCのWrapperだからね
      • それはtRPCをHonoで使うためのアダプターであって、Hono RPCの内部がtRPCというわけではないないと思う
        • アダプターに加工しているだけで、tRPCのServerライブラリを使っているよ
          • そうなの!?
            • @hono/trpc-serverの内部実装をみる感じそうだろうと思うんだよね〜
      • tanstack周りとtRPCが相性いいのは知らんかった

© 2026 Shotaro Kinjo