Claude Media
Netlify MCPサーバーの使い方 — Claude Codeからのデプロイ手順
Claude CodeMCPClaude連携チュートリアル

Netlify MCPサーバーの使い方 — Claude Codeからのデプロイ手順

Netlifyの公式MCPサーバーはリモート版とローカル版の2種類あります。Claude Codeでの接続コマンドと認証のつまずきどころをまとめます。

読了目安 約9分

Netlifyは、コードエージェントがNetlifyのAPIとCLIを自然言語の指示で操作できるMCPサーバーを公式提供しています。プロジェクトの作成・デプロイ・環境変数の管理・アクセス制御の変更までを、Claude Codeのセッションを離れずに任せられます。サーバーはリモート版とローカル版の2種類あり、Claude Codeへの接続はどちらもコマンド1行で終わります。

Netlify MCPサーバーとは — リモート版とローカル版の違い

Netlify MCPサーバーは、Netlify公式が配布するMCP実装です。リモート版のエンドポイントはhttps://netlify-mcp.netlify.app/mcpで、ローカルにサーバーを立てずに接続できます。ローカル版はnpmパッケージ@netlify/mcpとして配布され、MCPクライアントがnpx経由で起動します。

Netlifyの案内では、常に最新のMCP機能を使えるリモート版が推奨です。ローカル版が要るのは、社内ポリシーで外部のリモートMCPサーバーへの接続が制限されている環境など、限られたケースです。対応クライアントにはClaude Code・Claude Web(Netlifyコネクタ経由)・Claude Desktop(同)・Codex・ChatGPT(Netlify App経由)・Windsurf・Cursor・Cline・Warp・LM Studioなどが並びます。

Claude Codeで接続する手順

リモート版はNetlifyが提供する汎用インストーラーで一括設定できます。インストール済みのAIクライアントを自動検出し、対話的に接続先を選ばせてくれます。

npx -y add-mcp https://netlify-mcp.netlify.app/mcp

Claude Codeだけに絞って追加する場合はclaude mcp addコマンドで直接指定します。

claude mcp add --transport http netlify https://netlify-mcp.netlify.app/mcp

ローカル版を使う場合のコマンド設定は次のとおりです。commandにnpx、argsに-yと@netlify/mcpを指定します。

{
  "mcpServers": {
    "netlify": {
      "command": "npx",
      "args": ["-y", "@netlify/mcp"]
    }
  }
}

Claude Code・Codex・Claude Desktopなど設定ファイルでMCPサーバーを管理するクライアントでは、このJSONをMCP設定ファイルにマージします。Claude Codeのclaude mcp addコマンドの構文とスコープ(ローカル・プロジェクト・ユーザー)の使い分けはClaude Code MCP設定ガイドにまとめています。

Claude Code以外のクライアントでの接続方法

Netlify MCPサーバーは、Claude Code以外にもWindsurf・Cursor・Claude(claude.ai・Claude Desktop)・Copilot(VS Code)・Cline・Warp・LM Studioなど幅広いMCPクライアントに対応します。設定ファイルを手で書くClaude Codeのようなクライアントに対して、CursorやLM Studio、VS CodeとVS Code Insiders、Gooseは公式サイトに一発インストール用のリンクが用意されています。クリックするとエディタが開き、上に示したリモート版の設定が自動で書き込まれます。

Claude(claude.ai・Claude Desktop)とChatGPTは設定ファイルを直接編集せず、それぞれの管理画面からNetlifyコネクタ・Netlify Appとして追加する経路になります。同じ「Netlify MCPサーバーに接続する」という操作でも、クライアントによってコマンド・設定ファイル・管理画面のどれを使うかが変わる点は覚えておくと迷いません。

前提条件 — Node.js 22以上とNetlifyアカウント

Netlify MCPサーバーの動作にはNode.js 22以上が必要です。バージョンはnode --versionで確認できます。nvmを使っている場合はnvm install 22とnvm use 22で切り替えます。加えてNetlifyアカウントと、接続先のMCPクライアントが必要です。CLI操作を代行させることが多いため、Netlify CLIをグローバルインストールしておくとエージェントの動作が安定します。

npm install -g netlify-cli

MCP経由でできること

Netlify MCPサーバーがカバーする操作は、Netlify APIとCLIの範囲に対応します。公式が挙げる用途は次のとおりです。

  • プロジェクトの作成・管理・デプロイ。新規プロジェクトの立ち上げからGitリポジトリのリンク、本番・プレビューへのデプロイまでをカバーする
  • アクセス制御の変更によるセキュリティ強化。パスワード保護やチームメンバーの権限といった設定をエージェント経由で変更できる
  • Netlify拡張機能のインストール・アンインストール。CDNキャッシュや画像最適化などの拡張機能を、ダッシュボードを開かずに追加できる
  • ユーザー・チーム情報の取得。所属チームやメンバー構成を確認する用途に使う
  • フォーム送信機能の有効化と管理。Netlify Formsの設定変更とスパムフィルタの調整に対応する
  • 環境変数・シークレットの作成と管理。デプロイコンテキストごとに異なる値を設定する運用も含む

これらはすべて自然言語の指示から呼び出せます。たとえば「このリポジトリを本番デプロイして」という指示は、プロジェクトのリンクとデプロイ実行のツール呼び出しに変換されます。「本番の環境変数にAPI_KEYを追加して」という指示であれば、環境変数の作成ツールが対応するデプロイコンテキストを判別したうえで実行されます。

認証のつまずきどころ — Personal Access Tokenの一時利用

Netlify MCPサーバーは通常、初回接続時にブラウザでのOAuth認証を求めます。認証がうまく進まない場合の代替手段として、Netlifyの個人アクセストークン(Personal Access Token、PAT)をMCP設定に直接渡す方法が用意されています。

{
  "mcpServers": {
    "netlify-mcp": {
      "command": "npx",
      "args": ["-y", "@netlify/mcp"],
      "env": {
        "NETLIFY_PERSONAL_ACCESS_TOKEN": "YOUR-PAT-VALUE"
      }
    }
  }
}

PATはNetlifyダッシュボードのユーザーアイコンからUser settings → OAuth → New access tokenで発行します。この方法はあくまで認証問題の切り分け用です。PATをリポジトリにコミットしないこと、問題が解決したら設定からPATを取り除くことが公式の注意事項です。設定ファイルにトークンを書いたまま放置すると、リポジトリを共有した相手にNetlifyアカウントへのアクセス権を渡すことになります。

エージェントスキルとの併用 — netlify.aiとcontext-and-tools

Netlifyは、MCPサーバーとは別に「エージェントスキル」も配布しています。ベストプラクティスをまとめたコンテキストで、Netlify Functions・Edge Functions・Blobs・Database・Image CDN・Forms・キャッシュ設定など機能ごとに分かれています。

npx skills add netlify/context-and-tools --skill '*' --yes

Claude Codeのようにスキル名での呼び出しに対応するエージェントでは、/<スキル名>の形式で個別のスキルを起動できます。MCPサーバーが「APIとCLIをツールとして呼び出す」役割を持つのに対し、エージェントスキルは「機能ごとの実装パターンをコンテキストとして渡す」役割です。両方を併用すると、ツール呼び出しの精度自体が上がります。

スキルの内訳を見ると、Netlify Functions・Edge Functions・Netlify Blobs・Netlify Database(マネージドPostgresとDrizzle ORM連携)・Image CDN・Netlify Forms・netlify.tomlによるファイルベース設定・Netlify CLI・デプロイ作成・Vite/Astro/TanStack Start/Next.jsのフレームワークアダプター・CDNキャッシュ制御・OpenAI/Anthropic/Google AI SDK向けのプロキシであるAI Gateway(netlify-ai-gateway)という機能単位で分かれています。個別にインストールする代わりに、Netlifyのコンテキストサイトを直接参照させる方法もあります。「https://netlify.aiを取得して、最新のエージェントスキルでNetlifyでのビルドとデプロイを手伝って」という指示を渡すだけで、スキルを個別インストールせずに同等のコンテキストを与えられます。

まとめ — リモート版から試すのが近道

Netlify MCPサーバーは、コマンド1行とOAuth認証でClaude Codeから接続できます。特別な事情がない限りリモート版(https://netlify-mcp.netlify.app/mcp)を選び、ローカル版とPATは制約がある環境向けの代替手段として覚えておくと迷いません。MCPツールごとの実行権限を絞りたい場合はClaude Code MCP権限ルールのserver:tool単位の書き方が参考になります。OAuthやPATでアクセス範囲を管理する考え方全般はMCPセキュリティガイドも参考になります。

この記事を共有:XはてブLinkedIn

関連する記事

Claude Code をもっと見る →