Claude Codeで開発

Claude Codeは、AnthropicのAIコーディングエージェントです。IronFlockはClaude Code向けに、ironflock-templatesスキルを含むプラグインを公開しています。このスキルは、IronFlockアプリがどのように構築され、プラットフォームにどのように組み込まれるかをエージェントに教えます。これにより、Claude Codeはアプリの設計図に沿った新しいアプリを作成し、アプリの.ironflock/フォルダ内のファイルをプラットフォームが想定するとおりに記述して、リリース前にチェックします：

ファイル	エージェントができること
`board-template.yml`	アプリのボードを構築：ウィジェットを選び、テーブルにバインドし、ページとナビゲーションをレイアウト
`data-template.yml`	コードが送信するデータに合ったテーブルと変換を定義
`env-template.yml`	アプリパラメータを追加
`port-template.yml`	リモートアクセス用のポートを宣言
`ai-template.yml`	アプリのAIエージェントとそのツールを定義

プラグインはGitHubで公開されています：IronFlock/agent-skills。

スキルの内容

アプリの設計図：状態を保持するテーブルからデバイスが提供するWeb UIまで、アプリの各部分がどのように連携するか。
Claude Codeが新しいアプリを作成する際のもとになる、設計図に沿ったスターターアプリ：すべてのデバイスで機械からデータを読み取り、各デバイスの状態と測定値をテーブルに保持し、ユーザーがボードで設定した閾値を適用し、ボードが埋め込むライブビューを提供するプログラム。
5つのテンプレートすべてのJSONスキーマ — https://ironflock.com/schemas/で公開されているものと同じです。
ボードテンプレートのガイド：データバインディング、フィルター、集計、ページ、ナビゲーション、レイアウト。
各ウィジェットがどのようなデータに向いているかを説明した、すべてのボードウィジェットのカタログ。
ボードが使用しているウィジェットのバージョンに正確に対応する、そのウィジェットの設定スキーマを読み取るツール。
各テンプレートを対応するスキーマと照合し、さらに通常はインストール時にしかプラットフォームが報告しないルール違反もチェックするバリデータ — 例えば、存在しないカラムにバインドされたウィジェットなどです。

要件

Claude Code — Anthropicのセットアップガイドを参照してください。
バリデータ用のPython 3.9以降。uvの使用を推奨します。uvを使うと、バリデータが自身の依存関係を自動的にインストールします。uvを使わない場合は、python3 -m pip install pyyaml jsonschemaを一度実行してください。
ウィジェットのスキーマが公開されているregistry.npmjs.orgとcdn.jsdelivr.netへのインターネットアクセス。

スキルのインストール

IronFlockのプラグインマーケットプレイスを追加し、そこからプラグインをインストールします。Claude Code内からでも、ターミナルからでも実行できます：

Claude Code内


/plugin marketplace add IronFlock/agent-skills
/plugin install ironflock@ironflock

プラグインはユーザーアカウント単位でインストールされるため、Claude Codeはすべてのプロジェクトでこれを使用できます。プラグインは新しいセッションで読み込まれます。すでに実行中のセッションでは、/reload-pluginsを入力してください。インストールを確認するには、claude plugin listを実行します — ironflock@ironflockが一覧に表示されます。

チーム向けのセットアップ

アプリに携わる全員がプラグインを使えるようにするには、次のファイルを.claude/settings.jsonとしてアプリのリポジトリにコミットします：


{
  "extraKnownMarketplaces": {
    "ironflock": {
      "source": { "source": "github", "repo": "IronFlock/agent-skills" },
      "autoUpdate": true
    }
  },
  "enabledPlugins": { "ironflock@ironflock": true }
}

チームメンバーがそのフォルダを信頼すると、Claude Codeはこのファイルを適用します。

スキルの使用

スキルを呼び出す必要はありません。IronFlockアプリで作業していると、Claude Codeが自動的にスキルを使用します — 例えば、次のように依頼した場合です：

「すべての機械の現在の温度を、ゲージと24時間のトレンドで表示するボードをこのアプリに追加して。」
「サンプリング間隔を、デバイスごとに1～60秒の範囲で設定できるようにして。」
「ポート8080のWeb UIをリモートアクセスで利用できるようにして。」
「各IPCのタンクの液位を読み取る新しいアプリを作って。低液位アラームの閾値は、オペレーターがすべてのタンクに対して1か所で設定できるようにして。」

スキルを明示的に開始するには、/ironflock:ironflock-templatesと入力します。

Claude Codeはまずアプリのコードを読み、テーブルがコードの送信するデータと一致するようにします。次にテンプレートを作成し、エラーがなくなるまでバリデータを実行します。その後、UI Builderでボードを開いて視覚的に調整できます — UI Builderは同じboard-template.ymlを読み書きします。

スキルが変更するのは、アプリのリポジトリ内のファイルだけです。アプリを使用しているプロジェクトに変更を届けるには、アプリの新しいバージョンをリリースします — リリースとアプリストアを参照してください。

エージェントを使わずにテンプレートを検証する

バリデータは、例えばCIパイプラインなどで単独で実行することもできます：


git clone https://github.com/IronFlock/agent-skills
uv run agent-skills/plugins/ironflock/skills/ironflock-templates/scripts/validate.py path/to/your-app

検出結果ごとに、ファイル、行、パスを含む1行を出力し、エラーが見つかった場合は終了コード1で終了します。

アンインストール


claude plugin uninstall ironflock@ironflock
claude plugin marketplace remove ironflock