VSCode + Claude Code で draw.io の構成図を作る（MCP連携の手順）
Hiroba による自動要約
VSCode上でClaude CodeとMCPを連携させることで、ブラウザを切り替えることなく日本語の指示だけで draw.io の構成図を生成・編集できる。VSCode拡張「Draw.io Integration」とdraw.io公式MCP サーバーを連携させるセットアップ手順と、実際のワークフローを紹介。
読んで良かったら、シェアしてみてください。
同じタグの記事が他に 5426 件あります。
関連する記事
同じタグの記事
Riveのデータバインディングを、エディタを開かずに.rivへ書き込めるようにした
QiitaRiveのエディタなしで.rivを作成・編集するMCPサーバー「rive-mcp」が、データバインディングの書き込みに対応。`riv_create` でViewModel定義と、文字・数値・色・真偽値の図形への配線、`rangeMapper` による値変換を.rivに書き込み可能に。Claude Codeへの自然言語指示で、アプリから値を差し替えられるUIアニメーションを生成したい開発者向け。
Riveのデータバインディングを、エディタを開かずに.rivへ書き込めるようにした
ZennRiveエディタ不要で.rivを生成・編集するMCPサーバー rive-mcp が、データバインディングの書き込みに対応。`riv_create` でViewModel定義と、文字・数値・色・真偽値の図形への配線、`rangeMapper` による値変換まで.rivに出力可能に。Claude Code から自然文で依頼でき、アプリ側は値の代入のみ。enum の文字表示不可、フォントの `subset` 指定必須などの制約も記載。
Claude CodeでJavaScript描画サイトのデータをJSON取得する：最適なスクレイピングAPIの選び方
QiitaClaude CodeからSPAなどJavaScript描画サイトのデータをJSONで取得する際のスクレイピングAPI選定ガイド。Firecrawl、Zyte API、Browserless、ScrapingBeeを返却形式で3タイプに分類し、Bright DataのMCPサーバーによるブロック対策、JSON Schema検証とフォールバック設計まで整理。スクレイピング基盤を構築する開発者向け。
Claude CodeにMCPサーバーを接続しWebページを取得する方法
QiitaClaude CodeにFetch系MCPサーバーを接続し、公開Webページを取得・要約・Markdown保存するまでの手順解説。`claude mcp add` での追加、local/project/userのスコープ選択、`/mcp` での接続確認、プロンプト例、ツールが表示されない場合の切り分け手順を収録。学習済み知識ではなく最新のWeb情報を参照させたいClaude Codeユーザー向け。