【超入門】HonoをCloudflare Workersにデプロイしてみる

Honoというフレームワークが最近ブイブイいわしてると聞いたので試してみた。
https://hono.dev/

Hono

いつもnpmを使っているが、気分を変えてbunを使っていく。

bun create hono my-hono-app

どのテンプレートを使うか聞かれるので、cloudflare-workersを選ぶ。

src/index.ts

import { Hono } from 'hono'

const app = new Hono()

app.get('/', (c) => {
  return c.text('Hello Hono!')
})

// 追加
app.get('/test', (c) => {
  return c.json({ message: 'This is a test' })
})

// 追加
app.get('/api/:name', (c) => {
  const { name } = c.req.param()
  return c.text(`Hello ${name}!`)
})

export default app

読むだけで何をしたいのかわかりやすくて素晴らしい。

ローカルでサーバーを立ち上げる。

bun run dev

すると、

• /にアクセス→ Hello Hono!というテキストが表示される
• /test→ JSONが表示される
• /api/jason→ Hello jasonというテキストが表示される
  • :nameをc.req.param()で取得している

Cloudflare Workersにデプロイ

事前にCloudflare Workersへのsign upが必要になる。とはいえ、sign upするだけで請求情報を入力せずともサイトをデプロイできる。

bun wrangler login
bun run deploy

これでCloudflare Workersにサイトがあっという間にデプロイされる。

Hono、Cloudflare Workers、そしてbunもすべて今回初めて触った。まだうまく言語化できないが、面白そう。小さくいろいろ作れそうなので、また試していきたい。