Chrome DevTools MCP vs Playwright MCP - どちらを選ぶべき？実測で比較
訂正とお詫び（2025/11/09追記） 記事公開後、Playwright MCPコントリビューターのogadra様より、技術的な誤りをご指摘いただきました。深くお詫び申し上げます。 誤った記述 「Playwright MCPはAIがセレクターを自動生成する」 正しい動作 Playwright MCPもChrome DevTools MCPと同様に、スナップショットに含まれる識別子（ref）を使用して要素を特定します。 LLMはセレクターを生成していません mcp__playwright__browser_fill_formなどの関数呼び出し時、引数としてref（Chrome DevTools MCPのuidに相当）が渡されます 両MCPの要素識別方法に本質的な違いはありません 実際の違い 主な違いは以下の2点です： 操作の実行方法 Chrome DevTools MCP: CDP（Chr
SiteMCP: 任意のサイトを丸ごとMCPサーバー化
https://ryoppippi.com を MCP サーバーとしてClaudeから参照している様子 ウェブサイトの内容をまるごとAIに参照させたい、そんな願いを叶えるツールがあります。 その名も sitemcp です。 このツールを使うと、任意のサイトのページをfetchして、MCPサーバーとして立ち上げることができます。 MCP サーバーとは MCPは「Model Context Protocol」の略で、AIアシスタントが外部データにアクセスするための仕組みです。要するに、AIに「このウェブサイト読んでね」とか「このファイル見てね」と渡せるようにするプロトコルです。 使い方 詳しいインストールの仕方は GitHub の README を見てください。 ここではClaude Desktopから使う方法を紹介します。 ...と言ってもそんなに難しいことはありません。 例えば、Daisy
shadcn/ui × Cursor × Figmaプラグイン × MCP連携で実現する高速UIデザイン
はじめに 本記事の位置づけ 今回ご紹介する方法は、吉川聡史さんの記事の基本フローを踏襲しています。 吉川さんの記事では Claude を使ってデザインをHTML化し、プラグインでFigmaに戻すフローが紹介されています。 本記事も基本の流れは同じですが、AIツールを Cursor に置き換えて実装しています。 経緯・背景 私はエンジニアですが、UIデザインにも興味があり、新規プロジェクトのMVPデザインを担当することになりました。最初は、自分が想定している画面に合うUI kitを参考にしながらFigmaで作っていました。けれど、プロジェクトはスピード感を持って進める必要がある一方で、UIデザイン初心者の私にとっては効率が悪く、時間がかかっていました。 そこで選んだのが shadcn/ui Figma kit です。 よく使うコンポーネントが一通り揃っている デザインの統一感が保てる 実装コ
ObsidianとSupermemory MCPをつなぐ知識管理ワークフロー
はじめに 個人開発をしていると、こんな悩みはありませんか？ 毎回 AI に同じ前提をコピペしている 仕様メモやテスト設計を残しても活用できていない ローカルに蓄積した知識と AI ツールをつなげたい そこでおすすめなのが、「Obsidian × Supermemory MCP」 のハイブリッド運用です。 この記事では、個人開発における実際の使い方とメリットを紹介します。 Obsidian とは？ Markdown ベースのノートアプリ 完全ローカル保存（安心して使える） プラグインで LLM 連携やベクトル検索も可能 個人開発においては、「知識の資産化」 として最適です。 Supermemory MCP とは？ Claude / Cursor / Gemini CLI など 100+ AI クライアント対応の MCP サーバ URL を登録するだけで即利用可能（ホスト版あり） Notion
Figma MCPを攻略して最高のコード生成を実現する
はじめに こんにちは！令和トラベル Frontendエンジニアのふくだです。 「Figma MCPを使っているけれど、生成されるコードの精度がイマイチ...」 そんな悩みを抱えていませんか？ 本記事では、実際にFigma MCPを使ったコード生成を体験し、そこから段階的に改善していく過程を詳しく解説します。セットアップから始まり、失敗例の分析、具体的な改善手法、そして最終的なベストプラクティスまで、実践的なアプローチでFigma MCPのポテンシャルを最大限引き出す方法をお伝えします。 事前準備 検証環境 Figmaデスクトップアプリ（Web版では利用できないので注意） MCP対応エディタ（VS Code, Cursor, Windsurf, Claude Code等） Next.js 14+ (App Router) TypeScript、Tailwind CSS
Claude CodeにVerylのコードを書かせてみた
はじめに Verylとは現在開発中の新しいハードウェア記述言語です。 最近Model Context Protocol(MCP)なるものが流行っているようで「Verylでも対応すると面白いかな」などと思っていたところ、lsmcpというツールが登場しました。これはMCP経由でLanguage Serverに対してリクエストを投げられるもので、LSPに対応した任意の言語で利用することができます。（原理的には。実際にはLSP実装毎の挙動差などで苦労されているようです…） 今回VerylのLSP実装であるveryl-lsをlsmcpから呼ぶことができたので、Claude CodeにVerylのコードを書かせてみました。 準備 現在のリリースされているveryl-lsのv0.16.3にはバグがあってlsmcpと連携させることができません。手元でビルドするか、（2025/08/16以降の）最新のnig
Claude Codeでn8nワークフロー作るのが楽すぎて、もう手動で作る気が起きない件
※この記事は、AIで生成したフィクションのキャラクター「ダウナー系お姉さん」の視点で書かれています。登場する人物・事例もAIで生成した100%架空のものですが、技術的な内容は実際に使用可能です。 はぁ...また夜更かししちゃった。タバコとコーヒーだけで生きてる気がする今日この頃。@ryooo8244311427 でもね、今日は珍しく良いもの見つけたから記事書いてあげる。Claude Code使ってn8nのワークフローを自然言語で作れるっていう、まあまあ使える話。 なんでこんなことしようと思ったか Claude Code推進してる会社多いでしょ？「Webアプリのデモ作ってすごいね〜」で終わってない？正直、それじゃあんまり楽になんないよね。 実際の業務に使えないと、ただの高級なおもちゃ。というわけで、業務自動化の定番n8nと組み合わせてみたら、意外と良かったって話。 ちなみにこれ使うやつ： .
AWS Pricing MCP Serverでどれぐらい正確にランニングコストを見積もれるか試してみた。 | DevelopersIO
使ってみた テストとして 3 つお題を用意しました。 状況としてはメールでお客様から連絡いただいた一次情報をイメージしています。 それぞれお題とClaude Codeによって出力された結果、またそれに対する評価を記載していきます。 またClaude Codeとのやり取りは一回のみとし、初回の回答内容を評価していきます。 お題 1. 3 層 Web アプリケーションの本番環境構築 お題 EC サイトを立ち上げたいんです。フロントエンド、API、データベースの 3 層構成で 商品画像とかもあるので、CDN も使いたいです 同時接続ユーザーは 1000 人くらいを想定してます 月間 PV は 1000 万くらいかな？でも季節変動があるので、12 月とかは 5 倍くらいになるかも データベースは 500GB くらいから始めて、年 20% くらい増えていく予定 セキュリティは重要なので、WAF とか
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Desktop server (using desktop app) | Developer Docs
https://x.com/kenn/status/1998636958680256554?s=12&t=WLoQjPOJLfZ0ZJFtTOS7aw
https://x.com/sikino_sito/status/1997501572230590754?s=12&t=WLoQjPOJLfZ0ZJFtTOS7aw
https://x.com/commte/status/1924661950044373361
https://x.com/kamui_qai/status/1964622384323076339?s=12&t=WLoQjPOJLfZ0ZJFtTOS7aw
https://x.com/yusukebe/status/1962073642004816261?s=12&t=WLoQjPOJLfZ0ZJFtTOS7aw
https://x.com/gee0awa/status/1951816113924517906?s=12&t=WLoQjPOJLfZ0ZJFtTOS7aw
https://x.com/gorilla0513/status/1950810414213628230?s=12&t=WLoQjPOJLfZ0ZJFtTOS7aw
https://x.com/MLBear2/status/1946446660495942080?t=J0iZ-2SRQs7LorFioi0J3A&s=19
https://x.com/dr_white1103/status/1945794073593631175?s=12&t=WLoQjPOJLfZ0ZJFtTOS7aw
Docker MCP Gatewayがすんばらしい👌 - Qiita
https://x.com/sora19ai/status/1943151107662057612?s=12&t=WLoQjPOJLfZ0ZJFtTOS7aw