使用技術

• hono
  • Webフレームワーク
• Bun
  • Node.js互換JSランタイム
• drizzle-zod
  • ORM（drizzle） × バリデーション（zod）
• zod-openapi
  • バリデーション（zod） × API仕様書（OpenAPI）
• swagger-ui
  • OpenAPIスキーマのビューワ
• openapi-generator
  • OpenAPIスキーマからコード生成？
• prism
  • OpenAPIスキーマからモックサーバーの公開？

[WIP]ディレクトリ構成

• routes
  • 【名前空間】
    • 【API名】.ts
• models
  • 【モデル名】
    • index.ts
    • table.ts
    • repository.ts
    • service.ts
    • schema.ts
  • commonSchema.ts
• apis
  • 【名前空間】
    • 【API名】
      • index.ts
      • handler.ts
      • schema.ts
  • commonSchema.ts
• middlewares
• utils
  • constants.ts

schemas

• それぞれの型・バリデーションを定義する

db

• drizzle によるテーブル定義、マイグレーションファイル
  • これを元にテーブルが作成される
• テーブルごとにファイルを作る
  • drizzle.config.ts を編集してこのディレクトリすべてを対象とするようにしておく
• models は drizzle-zod を使ってこれを元に型定義する

models

• モデルを担当
• drizzle-zod を使ってマイグレーションファイルをベースにする
  • マイグレーションファイルでは足りないルールのみ追加する

requests

• リクエストを担当
• routes に対応させる？

responses

• レスポンスを担当
• routes に対応させる？

routes

• API エンドポイントを実装する
• hono v4 で実装予定のファイルベースルーティングを採用

server.ts

• bun run --hot コマンドのエントリーポイント

Bun

Bun のインストール（WSL2/Ubuntu）

• WSL を開きます。
• Ubuntu を起動します。
• unzip がインストールされていることを確認します。インストールされていない場合は、sudo apt install unzipを実行してインストールします。
• 次のコマンドを実行して Bun のインストールスクリプトをダウンロードします: curl -fsSL https://bun.sh/install | bash
• ファイルの末尾に次の行を追加して Bun のパスを通します: echo 'export PATH="$HOME/.bun/bin:$PATH"' >> ~/.bashrc
• 変更を適用するために、source ~/.bashrcを実行します。
• bun --versionを実行して Bun が正しくインストールされ、パスが通っていることを確認します。

hono

hono のインストール

• WSL を開きます。
• Ubuntu を起動します。
• Bun がインストールされていることを確認します。インストールされていない場合は、Bun のインストール手順に従ってインストールしてください。
• 次のコマンドを実行して hono をインストールします: bun add hono
• インストールが完了したら、bun hono --versionを実行して hono が正しくインストールされていることを確認します。

プロジェクトの作成

• WSL を開きます。
• Ubuntu を起動します。
• Bun がインストールされていることを確認します。インストールされていない場合は、Bun のインストール手順に従ってインストールしてください。
• 次のコマンドを実行して、hono プロジェクトの雛形を作成します: bun create hono
• プロジェクト名を入力します
• デプロイ先を選択します。ここでは cloudflare-workers とします。
• しばらく待つとプロジェクトの作成が完了します。
• 作成されたプロジェクトのディレクトリに移動します。例えば、cd my-hono-projectを実行します。
• プロジェクトの依存関係をインストールします。ディレクトリ内でbun installを実行します。
• mkdir src/routesでファイルベースルーティング用のディレクトリを作成します。
• mv src/index.ts src/routes/server.tsでエントリーポイントを変更します。
• tsconfig.jsonにbaseUrlと@を定義しておきます。
• プロジェクトが正しく作成されたことを確認するために、bun run --hot src/routes/server.tsを実行してローカルサーバーを起動します。
• ブラウザを開き、http://localhost:3000にアクセスして、hono プロジェクトが正しく動作していることを確認します。

D1

• 予め cloudflare に登録しておきます。
• bunx wrangler loginを実行し、ブラウザが開いたら cloudflare にログインして認証します。
  • wrangler.toml が作成されます。
• bunx wrangler d1 create hono-dbで D1 のデータベースを作成します
  • hono-db部分は適宜変更してください。
• コマンド実行後に表示されるデータベース情報（[[d1_databases]]）を wrangler.toml に記述します

drizzle(d1)

• bun add drizzle-orm drizzle-zodで
• bun add -D drizzle-kitで
• touch .envで
• touch drizzle.config.tsで
• mkdir src/schemasで
• mkdir src/schemas/dbで
• touch src/schema/db/commonColumns.tsで
• touch src/schema/db/tables/user.tsで
• touch db.tsでファイルを作成し、DB クライアントとの接続処理を追加します。
• bunx drizzle-kit generate:sqliteでsqliteのマイグレーションファイルを作成します。
• bunx wrangler d1 migrations apply hono-db --localでマイグレーションファイルを実行します。
• docker-compose upで docker コンテナをビルド・起動します
• 次のコマンドでレスポンスが返ってくることを確認します -- ※Content-Type がapplication/x-www-form-urlencodedの状態だとc.req.parseBody()を使用する必要がある

curl -X POST http://localhost:3000/users/post \
     -H "Content-Type: application/json" \
     -d '{"password": "hogefuga"}'

zod-openapi

• bun add hono zod @hono/zod-openapi
• mkdir src/schemaでスキーマ用ディレクトリを作成します。
• touch src/schema/user.tsで User の Schema ファイルを作成します。
• mkdir src/routes/usersで user の api 用ディレクトリを作成します。
• touch src/users/myPage.tsで user の api ファイルを作成します。 -- sample/src/schema/user.tsを参考に内容を記述します。

参考

• Bun + hono + zod-openAPI https://github.com/openstatusHQ/openstatus/tree/main

• drizzle-kit https://zenn.dev/satonopan/articles/9182a9eda4d574

• drizzle-zod https://zenn.dev/mt_southern/scraps/e6f4d256f07353

• drizzle D1 https://qiita.com/kmkkiii/items/2b22fa53a90bf98158c0

• swagger-ui Prism https://zenn.dev/kigi/articles/bb446df063ff54