Skip to Content
IoT アプリ開発Claude Codeで開発

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。

スキルの内容

  • 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内からでも、ターミナルからでも実行できます：

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

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

最新の状態に保つ

Claude Codeがサードパーティのマーケットプレイスのプラグインを更新するのは、自動更新を有効にした場合だけです。この設定は一度有効にするだけで済みます：Claude Codeで/pluginを実行し、Marketplacesを開いてironflockを選択し、Enable auto-updateを選びます。または、手動で更新します：

claude plugin marketplace update ironflock
claude plugin update 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をリモートアクセスで利用できるようにして。」

スキルを明示的に開始するには、/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
Last updated on
エッジコードの記述DockerとCompose