0
2

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

Hono🔥 フレームワーク基礎

Posted at

Honoはクラウド環境で動作する軽量なWebフレームワークです。本記事では、Honoの特徴と簡単なアプリケーションの作り方について解説します。

Honoは、TypeScript/JavaScriptで書かれたシンプルかつ強力なWebフレームワークです。小さなコード量で軽快に動作し、クラウド上のサーバーレス環境にデプロイできるよう最適化されています。ミドルウェアやルーティングを活用して、スケーラブルなAPIを構築できます

インストール

Node.jsがインストールされている環境でプロジェクトを作成します。

以下のコマンドでHonoをインストールします。

npm install hono

はじめてのHonoアプリ

以下に、最も基本的なHonoアプリの例を示します。

import { Hono } from 'hono'

const app = new Hono()

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

export default app

実行方法

上記のコードをindex.tsやapp.tsなどのファイルに保存します。

ローカルで実行する場合は、適切なNode.js実行環境とトランスパイラ(ts-nodeなど)を用意した上で、次のように実行します。

ts-node index.ts

※ 純粋なJavaScriptで書く場合、拡張子を.jsに変えて実行してください。

ルーティング

Honoでは、エンドポイントごとにHTTPメソッドとパスを定義できます。以下の例では/usersというパスを管理するルーターを追加しています。

app.get('/users', (c) => {
  // ユーザー一覧を返す例
  return c.json([
    { id: 1, name: 'Alice' },
    { id: 2, name: 'Bob' },
  ])
})

app.post('/users', (c) => {
  // ユーザーを作成する処理
  // ...
  return c.text('ユーザーが作成されました')
})

ミドルウェア

Honoにはミドルウェアを追加でき、ログ出力や認証などの処理を共通化できます。

app.use('*', async (c, next) => {
  console.log(`アクセス: ${c.req.method} ${c.req.url}`)
  await next()
})

ルートごとにミドルウェアを設定することも可能です。

デプロイ

Honoはクラウドワーカー環境向けに設計されています。Cloudflare Workersへデプロイする例を示します。

  1. wranglerのインストール
npm install -g wrangler
  1. wrangler.tomlの設定

Cloudflare Workers用の設定ファイルwrangler.tomlを作成し、以下のように設定します。

name = "my-hono-app"
main = "index.js"   # ビルド後のメインファイルを指定
compatibility_date = "2025-02-16"

[build]

command = "npm run build"

[vars]

ENV = "production"
  1. ビルドスクリプトの用意

package.jsonにビルドスクリプトを設定し、TypeScriptからJavaScriptに変換します。

"scripts": {
  "build": "tsc index.ts --outDir dist"
}
  1. デプロイ
wrangler publish

正常にデプロイされれば、Cloudflare WorkersのURLでHonoアプリが動作します。

まとめ

Honoは非常に軽量でシンプルな構成ですが、拡張性が高くサーバーレス環境への対応もスムーズです。上記のように基本的なWebアプリからAPIサーバーまで、幅広い用途で活用できます。ぜひ一度、手軽に始めてみてください。

0
2
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
2

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?