コンテンツにスキップ
HaneDOCS
EN

アプリを作る

ローカル開発

Hane の公開 API・コンソール・参照アプリを手元で起動し、作りもののデータでアプリを作って試す方法です。

このページでは、Hane を手元の 1 台で起動して、アプリの開発に使う方法を説明します。手元の環境は Cloudflare のアカウントも LLM の鍵も要らず、外へのメールや電話は emulator が受けるので、外には何も送りません。

必要なもの

Section titled “必要なもの”
もの 使うところ
Node.js 22.13 以上と pnpm 10 開発サーバーと試験
Docker 文書のマルウェア検査（ClamAV）と、CLI のサンドボックス。使わなければなくても起動します
Codex CLI か Claude Code driver: codex・driver: claude の Agent を手元で動かすときだけ。手元でログインしておきます

起動する

Section titled “起動する”

  1. 依存を入れて開発サーバーを起動する

    ターミナルウィンドウ
    pnpm install
    pnpm dev

    pnpm dev は、開発用の IdP、外部の事業者の emulator、公開 API の入口と共通 API、コンソール、参照アプリをまとめて起動します。

  2. 作りもののデータを入れる

    別の端末で seed を流します。開発用の組織 acme・利用者・プロジェクト fleet と、参照アプリのサービスアカウントと API キー、定義、データを、公開 API と hanectl で入れます。

    ターミナルウィンドウ
    pnpm dev:seed

    参照アプリの API キーは examples/fleet/.dev.vars に書かれます。このファイルは Git に入れません。

  3. 画面を開く

    ブラウザでコンソール（http://localhost:5173）か参照アプリ（http://localhost:5174）を開き、開発用の IdP の画面で利用者を選んでログインします。パスワードはありません。

ポートと利用者

Section titled “ポートと利用者”
URL 中身 ログインする利用者
http://localhost:8787 公開 API の入口 API キーかアクセストークン
http://localhost:8788 開発用の IdP（OIDC、PKCE） —
http://localhost:5173 コンソール 開発 管理者（owner@example.test）
http://localhost:5174 参照アプリ（車両リース管理） 車両 担当（fleet@example.test）
http://localhost:8789 emulator。Hane が送ったメールなどを見られます —
http://localhost:5175 UI ライブラリのカタログ（pnpm dev:ui で起動） —

利用者はすべて作りものです。承認の確かめには「承認 部長」（approver@example.test）、閲覧だけの権限の確かめには「閲覧 太郎」（viewer@example.test）でもログインできます。

hanectl を手元で使う

Section titled “hanectl を手元で使う”

seed は hanectl の context を .hane/hanectl.json に作ります。手元の開発用の IdP の利用者でログインし直すこともできます。

ターミナルウィンドウ
HANECTL_CONFIG=.hane/hanectl.json cli/hanectl/bin/hanectl.mjs rollout status
cli/hanectl/bin/hanectl.mjs login --dev-user owner@example.test --org acme --project fleet --env dev

--dev-user は手元の開発用の IdP からだけ id_token を取ります。アクセストークンは 15 分で切れますが、--dev-user でログインした context は hanectl が自動で取り直します。

自分のアプリを手元の Hane につなぐ

Section titled “自分のアプリを手元の Hane につなぐ”

自分のアプリの BFF は、参照アプリと同じく手元の入口（http://localhost:8787）を呼びます。利用者のログインには開発用の IdP（http://localhost:8788）の認可コードと PKCE を使い、得た id_token とアプリの API キーをトークン交換します。BFF の書き方は アプリの構成 と 認証 にあります。

定義を変えたら、hanectl apply の後に hanectl release create -f <bundle.yaml> --activate で有効なバージョンを作り直します。

Agent のドライバーを選ぶ

Section titled “Agent のドライバーを選ぶ”

pnpm dev の既定のプロファイル local では、driver: llm の Agent は emulator の決まった応答で動き、CLI のドライバーは動きません。手元の CLI で Agent を動かすときは、開発サーバーを止めてからプロファイルを選びます。

ターミナルウィンドウ
pnpm dev:stop
HANE_DEV_PROFILE=local-claude pnpm dev   # Claude Code を使う。Codex CLI なら local-codex

止める・消す

Section titled “止める・消す”
コマンド すること
pnpm dev:stop pnpm dev と pnpm dev:scanner が起動したものを止める
pnpm dev:reset 手元の状態（.hane/）を消す。必ず pnpm dev:stop の後に実行する
pnpm dev:scanner 別の端末で、文書の検査に使う ClamAV の Docker コンテナを起動する
pnpm dev:smoke 満了対応の縦断が公開 API で通るかを確かめる

スコープや定義の名前を変えたときは、pnpm dev:reset → pnpm dev → pnpm dev:seed で作り直します。seed が前に作ったサービスアカウントは、古いスコープのまま残るためです。

作りもののデータは 2026-10-30 を今日として作ってあります。日がたつと、毎日の検知に掛かる契約や期限までの日数が変わります。

次に読む

Section titled “次に読む”
参照アプリのチュートリアル手元で車両リース管理を動かして読む
hanectl定義の apply と ReleaseBundle の有効化