mcpField
P
Pinpoint

Pinpoint

ローカル
github.com開発ツール96 日前に更新
リポジトリ公式サイト

Pinpoint について

Pinpointは、実行中のブラウザーアプリやiOS Simulatorの要素に対するコメントを取得するローカルブリッジ兼MCPサーバーです。選択要素のセレクター、DOMパス、スタイル、コンポーネント階層、ソースの手掛かり、スクリーンショットをコーディングエージェントに渡します。

主な機能

  1. 01ブラウザーまたはiOS Simulatorの要素を選択
  2. 02選択した要素にコメントを付与
  3. 03セレクター、DOMパス、スタイルを取得
  4. 04コンポーネント階層とソースファイルの手掛かりを添付
  5. 05フィードバックに切り抜きスクリーンショットを含める

活用シーン

  1. 01特定のUI要素の表示上の問題を報告
  2. 02UI変更の依頼に必要な文脈をコーディングエージェントへ共有

MCP 対応

stdioのMCPサーバーは稼働中のローカルブリッジに接続し、ブリッジが利用できない場合は保存済みのメモを読み取ります。ブリッジとiOS Simulator用ピッカーは127.0.0.1で動作します。

設定

ローカルサーバーの設定はどのクライアントでも共通です。コピーしてクライアントの MCP 設定ファイルに貼り付けてください。

mcp.json · 共通設定
{
  "mcpServers": {
    "gowtham012-pinpoint": {
      "command": "npx",
      "args": [
        "-y",
        "pinpoint-bridge"
      ],
      "env": {
        "PINPOINT_PORT": "<PINPOINT_PORT>"
      }
    }
  }
}
起動コマンドnpx -y pinpoint-bridge
設定が必要な環境変数
PINPOINT_PORTPort of the local Pinpoint bridge (default 7331)

ローカルサーバーにはマシン上の実行環境（Node.js 18 以上など）が必要です。設定ファイルの場所はクライアントごとに異なります。

パッケージ
npmpinpoint-bridge0.7.2

ツール

7

掲載時のツール一覧 · 1 週間前に更新

パラメーター型必須説明
urlstringいいえページ URL がこの文字列で始まる注釈のみ

詳細

pinpoint-bridge

Pinpoint を支えるローカルブリッジおよび MCP サーバーです。実行中のアプリ内の要素（ブラウザーのページ、または iOS Simulator のネイティブアプリ）を指し、変更内容を伝えると、コーディングエージェント（Claude Code、Cursor、Codex など）がセレクター、DOM パス、スタイル、コンポーネントチェーン、ソースファイルのヒント、切り抜いたスクリーンショットとともにコメントを受け取ります。

リポジトリからセットアップしてください。setup では、このパッケージに含まれていないブラウザー拡張機能も読み込みます。

git clone https://github.com/gowtham012/pinpoint
node pinpoint/bridge/cli.js setup

このパッケージは MCP クライアントが実行するものです。npx -y pinpoint-bridge mcp は、実行中のブリッジと通信するか、ブリッジが実行されていない場合は保存済みのメモを読み込む、stdio MCP サーバーです。iOS Simulator のピッカーは、ブリッジによって http://127.0.0.1:7331/ios で提供されます。すべて 127.0.0.1 上で完結します。

ドキュメント全文：https://github.com/gowtham012/pinpoint#readme

コメント

Markdown 対応

MCP は初めてですか？

プロトコルの概要から最初のサーバーの導入まで、よくある疑問にまとめて答えます。

AI アプリケーションが外部のツールやデータソースに統一的な方法で接続するためのオープンなプロトコルです。クライアントはモデルとの対話を担い、MCP サーバーはツール・リソース・プロンプトテンプレートを提供します。標準メッセージでやり取りするため、1 つのサーバーを複数のクライアントで再利用できます。