この記事何？
エンジニア歴1年半。業務で利用しているHonoが大好きだが、TSもプログラミング知識も弱々すぎて上手く使いこなせない。速いはずが多分生かせてない。
ちゃんと理解するためにソースコードリーディングしたい。
でも目的なくソースコード眺めても意味ないし……ねむい……
そうだ！PRを全部読めば、変遷やなぜ変更されているかストーリー的に分かるのでは。
と思ったのでチャレンジしてみる。PR2000以上あるので、全部できるかは知らん。
https://github.com/honojs/hono
#21 Migrate to TypeScript
TypeScript移行
突然サムズダウンされててわろた。嫌いか、TypeScriptが。
-
.js->.tsに変更。 - エントリーポイント変更: src/hono.js → dist/index.js
- tsconfig.jsonの追加
- ジェネリクスの導入
Node.ts
// 変更前（JavaScript）:
function Node(method, handler, children) {
this.children = children || {}
this.method = {}
if (method && handler) {
this.method[method] = handler
}
}
// 変更後（TypeScript）:
export class Node<T> {
method: { [key: string]: T }
handler: T
children: { [key: string]: Node<T> }
constructor(method?: string, handler?: any, children?: { [key: string]: Node<T> }) {
this.children = children || {}
this.method = {}
if (method && handler) {
this.method[method] = handler
}
}
insert(method: string, path: string, handler: T): Node<T> {
// ...
}
search(method: string, path: string): Result<T> {
// ...
}
}
など。
まだyarnだけ使ってるけど、Bunちゃんはいつごろ導入されたのかも気になる。肉まんが美味しい季節です。
#22 Remove methods.ts
methods.tsファイル削除
#23 json method in Context
Contextクラスにjson()メソッドを追加し、JSONレスポンスを簡単に返せるようにする
- Contextクラスを独立ファイルに分離
- json()メソッドを新規追加
json(object: object, replacer?: (string | number)[], space?: string | number): Response
- object: JSONに変換するオブジェクト（必須）
- replacer: JSON.stringifyの第2引数（省略可）
- space: JSON.stringifyの第3引数（省略可、インデント用）
機能:
- 引数がobject型かチェック
- JSON.stringify()でJSON文字列に変換
- Content-Type: application/json; charset=UTF-8ヘッダーを設定
- ステータスコード200でResponseを返す
基本的な使い方
// 変更前:
app.get('/api', (c) => {
const data = { message: 'Hello' }
const body = JSON.stringify(data)
return new Response(body, {
status: 200,
headers: {
'Content-Type': 'application/json; charset=UTF-8',
},
})
})
// 変更後:
app.get('/api', (c) => {
return c.json({ message: 'Hello' })
})
text()メソッドも追加されている。どっかのPRで見落としたな....
text(body: string): Response
使用例
c.text('Hello') // OK
c.text(123) // エラー: text method arg must be a string!
c.text({ msg: 'hi' }) // エラー: text method arg must be a string!
c.json、大変お世話になっております。なるほど。中身シンプルだけど、使用者として大変便利。
#24 Documentation
READMEにHonoの特徴や利点が追記される。
ルーターの実装はgoblinを参考にしています。APIの設計はexpressとkoaを参考にしています。itty-routerとSunderは、Cloudflare Workersの他のルーターまたはフレームワークです。
参考にしたフレームワークとか、こうやってREADMEに書くの初めて見た。敬意があってとても素敵。
#25
なし
普段使っているメソッドやミドルウェアが出てくると嬉しくなるな。Bunの登場も楽しみに次に進みます。