# Windsurf での MCP Web 検索とスクレイピング (/ja/quickstarts/windsurf)

<!-- agent-signals: reading_time_min: 1 · est_tokens: 259 · updated: 2026-07-30 -->
Related: [Node.js](/ja/quickstarts/nodejs.md), [Next.js](/ja/quickstarts/nextjs.md), [Express](/ja/quickstarts/express.md), [NestJS](/ja/quickstarts/nestjs.md), [Fastify](/ja/quickstarts/fastify.md), [Hono](/ja/quickstarts/hono.md)

Firecrawl MCP を使って、Windsurf に Web スクレイピングと検索機能を追加します。

<div id="quick-setup">
  ## かんたんセットアップ [#かんたんセットアップ]
</div>

<div id="1-get-your-api-key">
  ### 1. APIキーを取得する [#1-apiキーを取得する]
</div>

[firecrawl.dev/app](https://firecrawl.dev/app) に登録し、APIキーをコピーします。

<div id="2-add-to-windsurf">
  ### 2. Windsurf に追加 [#2-windsurf-に追加]
</div>

次を `./codeium/windsurf/model_config.json` に追加してください:

```json
{
  "mcpServers": {
    "firecrawl": {
      "command": "npx",
      "args": ["-y", "firecrawl-mcp"],
      "env": {
        "FIRECRAWL_API_KEY": "YOUR_API_KEY"
      }
    }
  }
}
```

`YOUR_API_KEY` を実際の Firecrawl API キーに置き換えてください。

<div id="3-restart-windsurf">
  ### 3. Windsurf を再起動する [#3-windsurf-を再起動する]
</div>

完了です！これで Windsurf で Web の検索とスクレイピングができるようになりました。

<div id="quick-demo">
  ## クイックデモ [#クイックデモ]
</div>

Windsurf で試してみてください：

**検索：**

```
最新のTailwind CSS機能を検索
```

**スクレイピング：**

```
firecrawl.dev をスクレイピングして、その機能を説明する
```

**ドキュメントを取得:**

```
Supabase認証ドキュメントを検索してスクレイピング
```

WindsurfのAIエージェントは、Firecrawlのツールを自動で利用します。