Generate Mcp App Ui (Grade A) logo

Generate Mcp App Ui (Grade A)Claude AIのセキュリティテスト開発スキル。MCP Toolのための生成されたMCPアプリウィジェット( 自己完結型HTML)。

(0)
Daniel Nikulshynレビュー: Daniel Nikulshyn·更新 2026年7月

概要

このスキルは、クレード (Claude) AIの開発スキルでセキュリティテスト開発スキルとされています。Grade Aです。このスキルは、MCPツールに対応したMCPアプリウィジェット(自己完結型HTML)を生成します。このスキルでは、使用者が視覚化したい表現の説明とツールのテスト出力をJSON形式で入力する必要があります。この生成されたウィジェットは、ツール名が提供された場合、インタラクティブなウィジェットにできます。ウィジェットがツールを呼び出し、データを更新できます。

主な機能

  • 自己完結型HTMLウィジェットの生成
  • インタラクティブなウィジェットのサポート (callServerTool)
  • 複数のデータタイプをサポートするタイプセーフチェック
  • フルエントUIおよびデザインガイドラインの推奨

料金

モデル
Free
カテゴリー
東学サェソー
評価
まだレビューはありません

ユースケース

ツール出力の視覚化

ユーザーは、チャット会話でツールの出力をグラフまたは表形式で視覚化したい場合に、視覚化された表現の説明とツールのテスト出力をJSON形式で入力します。

インタラクティブなダッシュボード

ユーザーは、ツールのデータを表示するインタラクティブなウィジェットを作成してデータを自動的に更新したいので、ツール名とテスト出力を入力します。

メリット & デメリット

メリット

  • チャット会話での視覚化されたウィジェットの生成
  • インタラクティブなウィジェットとリフレッシュ機能
  • データのコンパクトかつ集中した視覚化

デメリット

  • ユーザーからの特定の入力 (視覚化された表現の説明とツールのテスト出力) が必要
  • 生成されたウィジェットは、提供されたデータに基づいてウィジェットを生成するため、ウィジェットの形状に関するあらゆる推測を行っません。

レビュー

レビューを投稿するにはログインしてください。

まだレビューはありません。最初の一人になりましょう!

Q&A

Can the widget refresh data automatically?

If you provide a tool name, the generated HTML can include a `callServerTool` function that lets the widget call the tool and refresh its data. Without a tool name, the widget displays the data read‑only.

Asked by Bilal Choudhury · Jan 11, 2026

Is there a learning curve to using this skill?

The main steps are describing the desired visual (e.g., chart, table) and supplying the tool’s JSON output. Once those are provided, the skill outputs the HTML; no additional coding is needed, though familiarity with Fluent UI guidelines can help customize the look.

Asked by Sarai Cohen · Jan 11, 2026

Do I need to provide my tool’s data before creating a widget?

Yes. The tool requires a test output in JSON format from the tool you want to visualize. Without this JSON, it will prompt you to paste it; it will not guess the data shape.

Asked by Yara Mansour · Nov 20, 2025

What kind of visual outputs can this tool generate?

It creates self‑contained HTML widgets such as charts, comparison tables or maps that display a tool’s JSON output. The widget is styled with Fluent UI for consistency and can be interactive if a tool name is supplied.

Asked by Tobias Hartmann · Oct 18, 2025

質問する

東学サェソーの代替

Using Git Worktrees (Grade A) logo
Using Git Worktrees (Grade A)東学サェソー

セキュリティテスト済みデータAISHILL(Grade A)。クリュードAIと併用する。

(0)
Free
Ga4 Bigquery Schema (Grade A) logo
Ga4 Bigquery Schema (Grade A)東学サェソー

セキュリティテスト済みのデータ・AIスキル用Claude AI。 Grade A。GA4 BigQuery Export Schemaの参照情報大全、ネスト構造、検索パターン、パフォーマンスのヒント

(0)
Free
Meta Capi (Grade A) logo
Meta Capi (Grade A)東学サェソー

Security-checked data-ai skill for Claude AI. Grade A. (Meta Conversions API (CAPI)のセットアップガイド — アーキテクチャ、イベントタイプ、顧客情報のハッシュ、削除、実装例、AEM)

(0)
Free
Callees (Grade A) logo
Callees (Grade A)東学サェソー

Claude AI向けセキュリティ検証済開発スキル。 Grade A. 関数/メソッドはどこにコールしているかをリストする

(0)
Free
Test Module Name (Grade A) logo
Test Module Name (Grade A)東学サェソー

セキュリティテスト済みデータ-AIスキル、クラウド AI用 Grade A。 モジュールをテストするモジュールと同じネームスペースのSpecサフィックスでモジュール名を付ける。 クラウド AIのテストモジュールライティングまたはレビューに使用してください。

(0)
Free
Board Of Directors (Grade A) logo
Board Of Directors (Grade A)東学サェソー

SECURITY TESTED DATA-AI SKILL FOR CLAUDE AI. GRADE A. マジョルな決定を実行者 5 人が協議しながらの実行者 5 人によるディレクトオフィス議論シミュレーション。プランの評価やアーキテクチャーセレクション、機能デザイン評価など、複数視点の専門分析を必要とするあらゆる決定を評価するには使用してください。

(0)
Free
Advpl Mvc Avancado (Grade A) logo
Advpl Mvc Avancado (Grade A)東学サェソー

セキュリティテスト開発スキル for Claude AI. AランクのMVCアドバンス

(0)
Free
D
Docs Writer (Grade A)東学サェソー

セキュリティテスト済みのDevOpsスキルClaude AIのためのGrade A。WORKFLOW スキル—リポジトリの文書の正確性と新鮮さをドキュメントサイト、アジェントファイル、そして変更履歴すべてで維持。WHEN: "更新ドキュメント"

(0)
Free