トーク

わたしはhono/ssgの提案者です。とはいえ色々あって最近のHonoにキャッチアップできておらず、久しぶりにみたところ残課題のplugin機能が実装されていたのだった… このトークは一応SSGを実装した一人が、いちユーザーとしての新鮮な気持ちを持ってhono/ssgをキャッチアップしていくための最新の知識を紹介します。

サービス間通信を実装する上で、スキーマを定義し何らかの方法で表現されているとスムーズに開発を進めることができます。言語に依存しないスキーマ表現方法としてOpenAPIがあります。

Next.jsはReactを用いたWebアプリケーションを作成するのに便利なフレームワークです。Next.jsはHTTP APIを提供する仕組みとしてRoute Handlersを提供しています。しかしながらRoute Handlersをそのまま用いてもAPIのスキーマを生成することはできません。Next.jsで提供しているHTTP APIのスキーマを別アプリケーションから参照したいときにこれでは不便です。

ところでhono/vercelを用いることによりNext.js Route HandlersでもHonoを使うことができます。
そしてhono-openapiと@hono/valibot-validatorを用いることによりHonoで提供するAPIのスキーマをOpenAPI形式で出力することができます。
さらに副次的な効果として、Honoならではの型や豊富なエコシステムによる支援を受けることができます。

このようにして我々はHTTP APIのスキーマを手に入れることができました。

このトークでは実際に以下の内容について話します。

• コードファーストでOpenAPIスキーマを生成するためのアプローチ
• Next.js Route HandlerからHonoへの段階的な移行

Astroは本体のコンポーネント言語としてはJSXを第一級ではサポートしていません。
そのうえで、Astroに「もうひとつの選択肢としてのJSX」を取り入れるなら、Hono JSXが最適な候補になり得ると考えています。

理由はシンプルです。Astroの「サーバー優先・必要な所だけ動かす」思想に、Hono JSXの素直さと軽さがそのまま一致するから。さらにAstro公式ロードマップ（JSX対応の検討、部分描画、フォーム処理の改善など）とも方向性が揃っています。

本セッションでは、次の点を設計の観点から整理して共有します。

• Astro core team でJSXを検討する議論の中で、Hono JSXが有力候補となる理由
• 実験的レンダラーの構成と実装の要点
• .astro と並走できる最小の利用パターンとガイド
• 段階的な検証内容と結果、および今後の課題

講談社「現代ビジネス」では、全ページをHonoによるMPA (Multi-Page Application) で提供しています。本セッションでは、大規模メディアでのHono実運用の設計指針、Next.jsからの移行理由とプロセス、そこで直面した課題や解決の工夫を紹介します。

特に hono/jsx および hono/jsx/dom (Client Components) を利用して必要な箇所のみクライアントで動的に動作させるHydrationを取り上げます。いわゆるIsland Architectureを採用しており、Honoでの実例は珍しいのではないでしょうか。またなぜこれを採用したか、React / Preactなど他のライブラリと比較して説明します。

さらに、Next.js App Routerからの移行について、RSC (React Server Components) など特徴的な機能をどう移行したか、Reactで書かれたcomponentをHono JSXの互換性を活かして再利用する方法も紹介します。

またNextのようなファイルベースでのルーティングの実装、JS/CSSアセットのビルドと配信、Viteの採用可否など、フレームワークをプロダクトに合わせて構築していく実践知を共有します。

Honoの利用やNext.jsからの移行を検討する方へ参考になる情報をお届けします。

このトークでは、チーム開発における Hono と @hono/zod-openapi を活用したスキーマ駆動開発の具体的プラクティスを紹介します。私は現在、この構成を採用したプロジェクトに二つ参加しています。

ひとつ目のプロジェクトでは、フロントエンドとバックエンドの双方が TypeScript で実装され、いずれも Hono を利用しています。スキーマ定義は共有資産として扱われており、Hono が提供する RPC 機能を活用することで、HTTP レベルの詳細を意識せず型安全な関数呼び出しのように API を利用できる仕組みを整えています。

もうひとつのプロジェクトでは、フロントエンドは TypeScript、バックエンドは Kotlin で実装されています。現状スキーマはフロントエンドに置かれていますが、将来的には共有資産へ移行が検討されています。スキーマに基づいたレスポンス検証をフロントエンドに組み込むことで、バックエンドの実装とスキーマが乖離している場合に不整合を早期に検知できるようになっています。

両プロジェクトに共通するのは、フロントエンドがスキーマを基にモックを手動実装している点です。これによりバックエンドの進捗に依存せず開発を進められるほか、動的なレスポンスも柔軟に再現可能になっています。

これらの事例を通じて、スキーマをどのチームが所有すべきかという組織的な判断だけでなく、フロントエンド主体でモックを整備することによる独立性の確保、Hono の RPC 機能を活用した効率的な開発プロセスの実現、さらにスキーマとレスポンスの整合性検証による品質担保といった実践的な知見を共有します。

このトークを通じて、参加者が自身の開発現場において Hono を用いたスキーマ駆動開発をどう適用できるかを判断するための視点を持ち帰っていただければと思います。

REST API開発において、Honoを用いて、OpenAPIを作成する場合、Hono OpenAPIとZod OpenAPI Honoという選択肢があります。しかし、コードファーストのアプローチがメインです。スキーマファーストのアプローチが欲しかったため、hono-takibiというライブラリを作成し、試行錯誤しています。

「スキーマ駆動で、Zod OpenAPI Honoによる、API開発するために、Hono Takibiというライブラリを作っている」という、LTでも申し込みましたが、レギュラートークでも申し込みます。

OpenAPIやTypeSpecのスキーマ定義から、Zod OpenAPI Honoのコードを生成し、スキーマ駆動のHonoのアプローチを紹介します。

「2ちゃんねる」に代表されるスレッドフロート型掲示板は、日本のインターネット文化の象徴です。本トークでは、「ゼロちゃんねるプラス」を参考に、この伝統的な掲示板をHono, Bun, Cloudflare Workersといった令和の最新技術スタックで再構築した個人開発プロジェクト「VakKarma」についてお話しします。

開発の核としたのは、型安全性の徹底的な追求です。フロントエンドからバックエンド、データベースアクセスに至るまで、一貫して型安全な開発体験を目指しました。
UI構築には、Honoベースのメタフレームワーク「HonoX」を採用。JSXを用いてReactのような開発体験で型安全なHTMLを構築できる点が大きな魅力です。これにより、従来のテンプレートエンジンが抱える型情報の喪失といった課題を解決しました。
データベース操作には、ESLintプラグイン「SafeQL」を導入。SQLクエリを静的に解析し型情報を生成、タイプミスや型の不一致をコーディング中に検出することで、実行時エラーのリスクを大幅に低減させました。

アーキテクチャはドメイン駆動設計（DDD）を意識し、ドメイン層・ユースケース層・リポジトリ層に分割。堅牢で保守性の高いコードベースを構築しました。
また、専用ブラウザ（ChMate）からの接続もサポートし、JavaScriptを無効化した環境でも動作するよう、クライアントサイドのJSに依存しない設計を採用しています。デプロイ先の選択肢も複数対応しています。

このトークを通じて、HonoXを用いたモダンなWebアプリケーション開発の魅力と、型安全性を軸にしたシステム設計の実践的な知見を共有します。

--- LT枠でも応募しているんですが、5分だとだいぶ切り詰める必要がありそうなので、レギュラートーク枠でも応募します ---

Hono・Bun・Drizzleという軽量かつモダンな技術スタックは、小〜中規模では高い開発体験を提供しますが、100を超えるテーブルを抱える大規模アプリケーションと組み合わせると、型定義の肥大化、マイグレーション管理の複雑化などの課題に直面します。
本LTでは、これらの課題を実際の開発現場でどのように捉え、対処しているのかを共有します。
特にテスト戦略では、Drizzleのネストしたトランザクションへの対応を活かし、Honoの処理全体をテスト単位でラップしてロールバック可能にすることで、DB状態をクリーンに保ちながらテストを高速に繰り返せる環境を構築しました。さらに、マイグレーション実行などI/O負荷の高い処理では、Dockerのtmpfs機能を利用してDBストレージをインメモリ化し、テスト速度を大幅に改善しています。
これから大規模DBにHonoやBun、Drizzleを導入しようと考えている方が、事前に押さえておくべき注意点や実践知見を持ち帰れる内容です。

Web地図界隈では古来より「地図タイル」という仕組みが存在します。
地図タイル配信のベストプラクティスは日進月歩で変化しており、かつてより遥かに低いコストで巨大な地図タイルを配信することが可能となっています。
タイル配信の最新のプラクティスをHonoと組み合わせることで、とても手軽に安いタイルサーバーを構築できます。本トークでは、地図タイルの理屈を簡単に紹介したうえで、AWSやCloudflareという基盤でHono製のタイルサーバーを構築・運用する手法を実際の事例を添えて紹介します。

アウトライン（予定）

1. 地図タイルの概要
2. Honoでタイルサーバーを実装する
3. AWS/Cloudflareにデプロイする
4. 事例紹介