この度、"草APIサービス" Pixela の MCP サーバーを実装・公開しました。
そもそも Pixela ってなんぞや？という方は、以下のページもご確認いただけると嬉しいです。
この記事ではその簡単な使い方や、利用イメージの一例をご紹介します。
Pixela MCPサーバーの使い方
今回作った Pixela の MCP サーバーを利用する場合、そのコンテナイメージを Docker Hub にアップロードしていますので、それを利用する形がオススメかと思います。
https://hub.docker.com/repository/docker/pixelaapi/pixela-mcphub.docker.com
そして、現状だと MCP サーバーを利用するには MCP クライアントが必要になるかと思うのですが、たとえば AI エディタである Cursor を MCP クライアントとして使用する場合の設定は、以下の通りです。
{ "mcpServers": { "pixela-mcp": { "command": "docker", "args": ["run", "--rm", "-i", "pixelaapi/pixela-mcp"] } } }
Cursor の MCP サーバーの設定は cmd + shift + p > Cursor settings > MCP & Integrations から可能です（Cursor v1.5.7の場合）。下のスクリーンショットのような状態になれば無事設定できていると思ってよいと思います。
利用イメージの一例
MCPクライアントに Pixela の MCP サーバーを設定することで、Pixela に対する操作（各種 Web API へのリクエスト）を AIエージェントがよしなに行えるようになります。
百聞は一見にしかず、ということで、私が Cursor に Pixela の MCP サーバーを設定した状態で AI エージェントとやりとりをする様子（のログ）をご覧いただけたらと思います。（Cursor の Chat ログエクスポートを使って取得できたものをほぼそのまま貼り付けているので、若干追いづらいかもしれません。すみません🙏）
User: こんにちは！これからあなたと簡単なスクリプトを書いていきたいと思っています。
Cursor: こんにちは！簡単なスクリプトを一緒に書いていきましょう！ まず、現在のワークスペースの状況を確認させていただきますね。 ワークスペースは空の状態ですね。どのようなスクリプトを作りたいか教えていただけますか？
例えば：
データ処理スクリプト
ファイル操作スクリプト
API連携スクリプト
自動化スクリプト
その他のユーティリティ
どんな種類のスクリプトを作りたいか、またどのプログラミング言語を使いたいか教えていただければ、一緒に作成していけます！
User: その前に、既にあなたに設定されている pixela-mcp は利用可能な状態になっていますか？
Cursor: はい、pixela-mcpが利用可能な状態になっています！利用可能な関数を確認してみましょう。
pixela-mcpには以下のような機能が利用できます：
ユーザー管理
ユーザーの作成・更新・削除
ユーザープロフィールの更新
グラフ管理
グラフの作成・更新・削除
グラフ定義の取得
グラフ統計の取得
ピクセル（データ）管理
ピクセルの投稿・更新・削除
ピクセルの取得（特定日、最新、今日など）
バッチ投稿
インクリメント・デクリメント
加算・減算
その他の機能
ウェブフックの作成・管理
ストップウォッチ機能
実際に動作確認をしてみましょうか？例えば、簡単なテストとしてユーザー一覧を取得してみることもできます。 どの機能を使ってみたいですか？それとも、pixela-mcpを使ったスクリプトを作成していきましょうか？
User: いいですね！これからここであなたとスクリプトを書いていく過程において、あなたが生成したコードの行数を Pixela に投稿（加算）していきながら作業を進めていきたいと思います。 なので、まずは Pixela にユーザー登録してくれますか？
Cursor: 素晴らしいアイデアですね！コードの行数をPixelaで追跡しながら作業を進めるのは、とても面白いアプローチです。 まず、Pixelaにユーザー登録を行いましょう。ユーザー名とトークンを設定する必要があります。
ユーザー名とトークンを決めていただけますか？例えば：
ユーザー名:daisuke-inoueやmcp-coderなど
トークン: セキュアな文字列（例:mcp-token-12345など）
それとも、私が適当な値を提案しましょうか？ ユーザー名とトークンが決まりましたら、Pixelaにユーザーを作成し、その後コード行数を追跡するためのグラフも作成していきます！
User: はい、適当な値を使ってユーザー登録してください！
Cursor: はい、適当な値でユーザー登録を行いますね！
ユーザー名:mcp-coder
トークン:**********
で登録してみましょう。
素晴らしい！ユーザー登録が成功しました！
次に、コード行数を追跡するためのグラフを作成しましょう。グラフID、名前、単位などを設定します：
グラフID:code-lines
名前:Code Lines
単位:lines
タイプ:int（整数）
色:shibafu（緑色）
グラフを作成してみますね。
完璧です！Pixelaの設定が完了しました。
これで、これから一緒にスクリプトを書いていく過程で、生成したコードの行数をPixelaに投稿できるようになりました。
次は、どのようなスクリプトを作成していきましょうか？例えば：
ファイル処理スクリプト
データ分析スクリプト
API連携スクリプト
その他のユーティリティ
どんなスクリプトから始めたいですか？
User: 手始めに、Rubyでfizzbuzzのスクリプトを書いてみてください。 書き終わったら、生成した行数を Pixela に add するのを忘れずに。
Cursor: はい！RubyでFizzBuzzスクリプトを作成しますね。まず、シンプルで読みやすいFizzBuzzスクリプトを書いていきます。
（スクリプト部分は割愛）
素晴らしい！RubyでFizzBuzzスクリプトが完成しました。コードは28行になりました。 それでは、生成したコードの行数をPixelaに投稿しましょう！今日の日付で28行を追加します。
完璧です！今日のPixelaに28行のコードが追加されました。
作成したFizzBuzzスクリプトの特徴：
シンプルで読みやすい構造
関数化して再利用可能
日本語のコメントで分かりやすく
1から100までの範囲で動作
スクリプトを実行してみたい場合は、以下のコマンドで動作確認できます：
bash ruby fizzbuzz.rb
次はどんなスクリプトを作成しましょうか？例えば：
ファイル処理スクリプト
データ集計スクリプト
その他のアルゴリズム実装
何かアイデアはありますか？
このような感じで、エージェントが生成したコードの行数を、自ら数え、自ら Pixela に登録させてみています。このときに実際に登録されたグラフは以下になります。
いいかんじですね！
以上です・その他の想定されるユースケース
この記事でお伝えしたいこととしては以上です。ここでは簡単のためにエージェントに対して直接指示を与えることで Pixela に対する操作を行ってもらっていますが、「コードを生成するたびに、必ずその生成した行数をカウントし、その結果を Pixela に投稿・加算すること。」、といったような指示を Cursor Rules（Cursor の場合）にあらかじめ指定しておけば、逐一プロンプトで与えずとも自動的に記録をしてくれるんじゃないかなと思います。
また、投稿する対象として今回は "生成したコードの行数" としましたが、
- 削除した行数
- エージェントを呼び出した回数
- 生成された内容を Accept / Reject した回数
- 与えたプロンプトの文字数
......といったような、コーディングAIエージェントの利用に関するあらゆるメトリクスを計測・記録するようにしてみると、AIエージェントを用いたプログラミングの生産性や利用パターン・傾向を可視化することができて、おもしろいかも？しれません（上記のようなメトリクス項目についてはいずれも未検証・実際に試してみてはいないので、すべてが本当に計測可能かはぜひご自身で確認してみてください！）。
それでは皆様、良い Pixela-life を！
......あ、Pixela は無料で使える Web API サービスではありますが、4回に1回ほどの割合で、APIリクエストが拒否されるという仕様があります。そのため、そのことを考慮したプロンプト / Rule を与える（「特定のエラーメッセージを含むレスポンスの場合にはリトライしてください」など）か、もしくは Pixela の有償サポータープログラムへの登録をご検討ください。:)
