noteで公開したChrome DevTools MCP記事2本

2025-09-29にnoteで公開した「ClaudeでChrome-devtools MCPを設定してブラウザを自動操作」「Gemini CLIからchrome-devtools MCPでブラウザを動かす」の2本をまとめて紹介します。

記事1: ClaudeでChrome-devtools MCPを設定してブラウザを自動操作

概要

Claude Desktop + Chrome DevTools MCPでブラウザの自動操作を実現する方法を詳しく解説。

主な内容

• Chrome DevTools MCPの設定手順
• Claude Desktopでの接続方法
• 実際のブラウザ操作デモ
• トラブルシューティング

ポイント

• GUIベースでの簡単な設定
• 視覚的なブラウザ操作が可能
• Webアプリケーションのテスト自動化に活用

記事2: Gemini CLIからchrome-devtools MCPでブラウザを動かす

概要

Gemini CLI環境でChrome DevTools MCPを活用し、コマンドラインからブラウザを制御する方法。

主な内容

• Gemini CLIの環境構築
• MCPサーバーの設定と接続
• CLIベースでのブラウザ操作
• Claudeとの機能比較

ポイント

• コマンドライン環境での柔軟な制御
• スクリプト化しやすい構成
• 開発ワークフローへの組み込みが容易

まとめ

両記事とも、Chrome DevTools MCPを使ったブラウザ自動化の異なるアプローチを紹介しています：

• Claude Desktop: GUI重視、視覚的な操作
• Gemini CLI: CLI重視、スクリプト化しやすい

用途や環境に応じて選択することで、効率的なブラウザ自動化を実現できます。

---

note記事リンク

• ClaudeでChrome-devtools MCPを設定してブラウザを自動操作
• Gemini CLIからchrome-devtools MCPでブラウザを動かす

※実際のnote記事URLに置き換えてください