12k
All articles

軽量WebAPI向けHonoJS入門

HonoJSでルート設定、ミドルウェアの追加、Node.js・Bun・Cloudflare Workersへのデプロイを通じて、軽量なWeb APIを構築する方法を解説する。

OpenReplay Team
OpenReplay Team
軽量WebAPI向けHonoJS入門

モダンなWeb APIの構築に、重いフレームワークや複雑なセットアップは必要ありません。複数のJavaScriptランタイムで動作する、ExpressやKoaの高速で軽量な代替手段をお探しなら、HonoJSがまさに求めているものかもしれません。

重要なポイント

  • HonoJSは、Node.js、Bun、Deno、Cloudflare Workersを含む任意のJavaScriptランタイムで動作する超高速Webフレームワークです
  • 最大限のポータビリティのため、Request、Response、Fetch APIなどのWeb標準上に構築されています
  • 20KB未満の最小バンドルサイズでExpressよりも優れたパフォーマンスを実現
  • CORS、ログ記録、圧縮のための必須ミドルウェアをすぐに利用可能

HonoJSの特徴

HonoJSは、Web標準上に構築された小さく超高速なWebフレームワークです。従来のNode.jsフレームワークとは異なり、Node.js、Bun、Deno、Cloudflare Workers、AWS Lambdaなど、任意のJavaScriptランタイムで動作します。このポータビリティは、Request、Response、FetchなどのWeb標準APIを基盤としていることから生まれています。

import { Hono } from 'hono'
const app = new Hono()

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

export default app

これが完全なHonoJSアプリケーションです。ボイラープレートも複雑な設定も不要で、クリーンでモダンなJavaScriptだけです。

初めてのHonoJS API構築

HonoJSの動作を確認するため、シンプルなREST APIを構築してみましょう。まず、新しいプロジェクトを作成します:

npm create hono@latest my-api

お好みのランタイム(Node.js、Bun、またはCloudflare Workers)を選択してください。この例では、Node.jsを使用します:

cd my-api
npm install
npm run dev

サーバーが http://localhost:3000 で動作しています。

HonoJSでのRESTルート構築

HonoJSは、Expressを使用したことがあれば自然に感じる馴染みのあるルーティング構文を使用します:

import { Hono } from 'hono'
const app = new Hono()

// GETエンドポイント
app.get('/api/users', (c) => {
  const users = [
    { id: 1, name: 'Alice' },
    { id: 2, name: 'Bob' }
  ]
  return c.json(users)
})

// JSONパースを含むPOSTエンドポイント
app.post('/api/users', async (c) => {
  const body = await c.req.json()
  // 本番環境では、データベースに保存
  return c.json({ message: 'User created', data: body }, 201)
})

// 動的ルート
app.get('/api/users/:id', (c) => {
  const id = c.req.param('id')
  return c.json({ id, name: 'User ' + id })
})

export default app

Contextオブジェクト(c)は、リクエストデータ、レスポンスヘルパー、ヘッダー、クッキーなどのユーティリティなど、必要なすべてを提供します。

本番対応APIのためのミドルウェア

HonoJSには必須のミドルウェアがすぐに利用できます。CORS、ログ記録、圧縮を追加する方法は以下の通りです:

import { Hono } from 'hono'
import { cors } from 'hono/cors'
import { logger } from 'hono/logger'
import { compress } from 'hono/compress'

const app = new Hono()

// ミドルウェアを適用
app.use('*', logger())
app.use('*', cors())
app.use('*', compress())

// ルートをここに記述
app.get('/api/health', (c) => c.json({ status: 'ok' }))

export default app

カスタムミドルウェアの作成は簡単です:

// シンプルな認証ミドルウェア
const authMiddleware = async (c, next) => {
  const token = c.req.header('Authorization')
  if (!token || token !== 'Bearer secret-token') {
    return c.json({ error: 'Unauthorized' }, 401)
  }
  await next()
}

// 特定のルートに適用
app.use('/api/protected/*', authMiddleware)
app.get('/api/protected/data', (c) => {
  return c.json({ secret: 'This is protected data' })
})

ランタイムポータビリティ:どこでもデプロイ

HonoJSの最大の利点の一つは、ランタイムの柔軟性です。同じコードが最小限の変更で異なるプラットフォーム上で動作します:

Cloudflare Workers用:

export default app

Node.js用:

import { serve } from '@hono/node-server'
serve({ fetch: app.fetch, port: 3000 })

Bun用:

export default { port: 3000, fetch: app.fetch }

これは、ローカルで開発を開始し、APIを書き直すことなくエッジロケーションにデプロイできることを意味します。

データベース統合による拡張

HonoJSでDrizzle ORMを使用した簡単な例は以下の通りです:

import { Hono } from 'hono'
import { drizzle } from 'drizzle-orm/better-sqlite3'
import Database from 'better-sqlite3'
import { postsTable } from './schema'

const sqlite = new Database('app.db')
const db = drizzle(sqlite)

const app = new Hono()

app.get('/api/posts', async (c) => {
  const posts = await db.select().from(postsTable)
  return c.json(posts)
})

app.post('/api/posts', async (c) => {
  const { title, content } = await c.req.json()
  const result = await db.insert(postsTable).values({ title, content })
  return c.json(result, 201)
})

export default app

パフォーマンスの利点

HonoJS APIは、ベンチマークにおいて一貫してExpressを上回るパフォーマンスを示します。最小限のオーバーヘッドとWeb標準の基盤により、より高速なレスポンス時間と低いメモリ使用量を実現します。エッジデプロイメントでは、小さなバンドルサイズ(20KB未満)により、コールドスタートが高速化されます。

まとめ

HonoJSは、Web API構築への新鮮なアプローチを提供します。シンプルさ、パフォーマンス、ランタイムの柔軟性の組み合わせにより、モダンなJavaScriptアプリケーションにとって優れた選択肢となります。マイクロサービス、サーバーレス関数、従来のREST APIのいずれを構築する場合でも、HonoJSは肥大化することなく必要なツールを提供します。

シンプルなAPIから始めて、必要に応じてミドルウェアを追加し、どこにでもデプロイする—それがHonoJSの方法です。

よくある質問

パフォーマンスの観点で、HonoJSはExpressとどのように比較されますか?

HonoJSは通常、最小限のオーバーヘッドとWeb標準の基盤により、ベンチマークでExpressよりも2〜3倍優れたパフォーマンスを示します。より高速なレスポンス時間、低いメモリ使用量、サーバーレスデプロイメントでの大幅に高速なコールドスタートを実現します。

既存のNode.jsパッケージやミドルウェアをHonoJSで使用できますか?

はい、Node.jsやBun上で動作する場合、HonoJSはほとんどのNode.jsパッケージと連携します。ただし、Cloudflare Workersなどのエッジランタイムでは、Web標準と互換性があり、Node.js固有のAPIに依存しないパッケージが必要です。

HonoJSは大規模な本番アプリケーションに適していますか?

はい、確実に適しています。HonoJSは本番対応であり、数百万のリクエストを処理するAPIで多くの企業に使用されています。軽量な性質、組み込みのTypeScriptサポート、包括的なミドルウェアエコシステムにより、小規模から大規模なアプリケーションまで理想的です。

Expressに慣れた開発者にとっての学習コストはどの程度ですか?

学習コストは最小限です。HonoJSはExpressと似たルーティングパターンとミドルウェアの概念を使用します。主な違いは、req/resの代わりにContextオブジェクトを使用することと、Web標準APIの使用です。ほとんどのExpress開発者は、数時間でHonoJSを使って生産的に作業できるようになります。

DevTools for the frontend

Gain Debugging Superpowers

Unleash the power of session replay to reproduce bugs, track slowdowns and uncover frustrations in your app. Get complete visibility into your frontend with OpenReplay — the most advanced open-source session replay tool for developers.

Star on GitHub12k

We use cookies to improve your experience. By using our site, you accept cookies.