サクサク読めて、
アプリ限定の機能も多数！
アプリで開く
1. はじめに こんにちは、次世代システム研究室のT.D.Qです。 デザインとコーディングの間にあるギャップを埋める新しいアプローチとして、FigmaでデザインされたウェブUIを自動的にHTML/CSSコードに変換する方法が注目されています。特に、オープンソースのFigma Context MCP（GLipsが公開）と、Visual Studio Code用AIエージェント拡張のRoo Codeを組み合わせることで、デザインからコーディングへのプロセスを大幅に効率化できます。本記事では、FigmaでデザインされたウェブUIを、GLipsが提供する「Figma Context MCP」とVisual Studio Code拡張「Roo Code」を用いて、効率的かつ正確にHTML/CSSコードに変換・取り込む方法を解説します。 2. MCPとRoo Codeの概要 2-1. Roo Cod
「Figmaデータからコードの自動生成できたら良いのに！」 と思いますよね。 CursorではFigmaのスクショ画像からコード生成は可能でしたが、 細かなデザイン仕様を把握していないので結局一つ一つ修正する必要があることや、 スクショして貼り付けて説明してみたいなことが面倒に思っていました。 ただ最近、FigmaのMCP Serverなるものを知り、 使い方によってはかなり実装が楽にできたので共有します！Figma MCP Serverについて MCPについては下記の記事がとても参考になったので詳しくは割愛しますが、AIと特定の外部サービス（今回はFigmaのAPI）とのやり取りを行えるようになる仕組みのことです。 今回は下記のFigma MCP Serverを使用してFigmaのデザインデータを取得できるようにします🏃 【2025/6/12追記】Figmaの公式MCPサーバーが
4/9(水) お昼にYouTubeでも解説します🙌 やさしいMCP入門 ＆ 実践LT会（KAGと学ぼう！勉強会） https://kddi-agile.connpass.com/event/351600/
はじめに CursorやGithub Copilot、Clineなど、コーディングに生成AIを使うのは当たり前になりました。AIにコードを書かせているとき、この仕様どおりに書いてくれないかなあ、と思う場面があります。Cursorには外部ドキュメントを読み込む機能があるので、指定しておけば、公開されているリファレンスなどをAIが読み込むことができるのですが、社内にある仕様書や開発標準などのドキュメントを参照したいケースもあるでしょう。この記事ではRunbookのMCPサーバーを使って、社内ドキュメントをAIに読み込ませる方法を紹介します。 Runbookについて Runbookはマニュアルや手順書を作成するためのWebサービスです。マニュアルを社内で共有したり、インターネットに公開したりできます。あと手順を組み合わせてワークフローのように実行できるらしいです。有料サービスですが、今回の方法で
1リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
