BunでREST APIを作ってみよう｜最小構成で理解するAPIサーバーの仕組み

「APIを作ってみたいけど、なんだか難しそう…」 そんなふうに感じている方でも大丈夫。Bunを使えば、最小構成で簡単にAPIサーバーを立ち上げることができます。 この記事では、Bunのserve機能を使って、実際にJSONレスポンスを返すAPIをゼロから作ってみましょう。

---

1. REST APIってなに？

まずはざっくり「REST APIとは？」を確認しておきましょう。

• REST（Representational State Transfer）：データのやりとりにルールを設けた設計思想
• API：プログラムが使う“問い合わせ口”のようなもの

たとえば：

• /api/hello にアクセスすると、{“message”: “Hello World”} が返ってくる
• フロントエンドからデータを取得・送信するために使われる

---

2. プロジェクトを用意しよう

まずはプロジェクトフォルダを作り、初期化します。

mkdir my-api && cd my-api
bun init

その後、index.ts というファイルを用意します。

---

3. BunのserveでAPIを立ててみる

以下が最小構成のAPIサーバーです：

// index.ts

Bun.serve({
  port: 3000,
  fetch(req) {
    const url = new URL(req.url);

    if (url.pathname === "/api/hello") {
      return Response.json({ message: "Hello from Bun!" });
    }

    return new Response("Not Found", { status: 404 });
  },
});

起動はこの1行：

bun index.ts

http://localhost:3000/api/hello にアクセスすると、JSONレスポンスが返ってくれば成功！

---

4. ルーティングを追加してみる

もう少しAPIっぽく、ルートを増やしてみましょう。

if (url.pathname === "/api/time") {
  return Response.json({ now: new Date().toISOString() });
}

これで /api/time にアクセスすると現在時刻が返ります。

---

5. よくある質問と注意点

疑問	回答
ポートが被って起動できない	port を 3001 や他に変更する
CORS対応は？	Headers を追加すれば対応可能
fetchで呼び出せる？	はい、フロントから問題なく使えます

---

まとめ

Bunのserveを使えば、APIサーバーが驚くほど簡単に立てられます。 まずは「JSONを返すだけ」でOK。自分のコードでAPIが動く体験をするのが一番の学びになります。 次回は、このAPIをReactやVueから呼び出して表示する方法をご紹介予定です！

---