Honoで作成したWeb APIをCloudflare Workersにデプロイする覚書

Honoを使ってアプリを作成し、Cloudflare WorkersにWranglerを使ってデプロイする方法を簡単にまとめました。Honoのプロジェクトは「npx create hono」で生成され、デプロイ先のインフラ構築は後から変更できます。Cloudflare Workersを選択し、Wranglerを用いてデプロイします。デプロイ完了後には、npm run deployコマンドでWorkersへのデプロイが行えます。Wranglerのエラーが発生した場合は、Cloudflareアカウントの接続状態を確認しましょう。

Honoでアプリを作って、Cloudflare WorkersにWranglerでデプロイするまでを簡単にまとめました。

Honoは`npx create hono`でプロジェクトを生成する

Honoには、create-honoコマンドが提供されています。そのため、npx create honoでアプリのセットアップが行えます。

% npx create hono@latest microcms-hono
Need to install the following packages:
  create-hono@latest
Ok to proceed? (y) y

セットアップ時に、どのインフラ・サービスにデプロイするかを聞かれます。セットアップされるコードが大きく変わりますが、後から設定を変えることは可能ですので、後戻りできないわけではありません。

? Which template do you want to use? › - Use arrow-keys. Return to submit.
❯   aws-lambda
    bun
    cloudflare-pages
    cloudflare-workers
    deno
    fastly
    lagon
    lambda-edge
    netlify
  ↓ nextjs

Cloudflare Workersを選択しましょう。

✔ Which template do you want to use? › cloudflare-workers

セットアップが完了するまで、少し待ちましょう。

create-hono version 0.2.6
✔ Which template do you want to use? › cloudflare-workers
cloned honojs/starter#main to /Users/development/examples/microcms-hono
✔ Copied project files

セットアップが終わり次第、アプリの構築を進めます。

Honoで作成したアプリを、Cloudflare Workersにデプロイする

Cloudflare Workersテンプレートでセットアップすると、npm-scriptにwranglerが含まれています。そのため、Workersへのデプロイはnpm run deployで行えます。

% npm run deploy
warning package.json: No license field
$ wrangler deploy --minify src/index.ts
 ⛅️ wrangler 3.5.0
------------------
Total Upload: 19.45 KiB / gzip: 7.23 KiB
Uploaded hono-microcms-demo (1.37 sec)

wranglerまわりでエラーが出た場合は、Cloudflareアカウントとの接続が済んでいるかなどを確認しましょう。