Generate Mcp App Ui (Grade A)Umiejętność programistyczna przetestowana pod kątem bezpieczeństwa dla Claude AI. Poziom A. Generuj widget aplikacji MCP (samodzielny HTML) dla narzędzia MCP. Opisz pożądany wygląd i wklej wynik testowy narzędzia. Użyj, gdy potrzebujesz.

— (0)

Zrecenzowane przez Daniel Nikulshyn·Zaktualizowano lipiec 2026

Przegląd

Generuj widget aplikacji MCP (samodzielny HTML) dla narzędzia MCP. Opisz pożądany wygląd i wklej wynik testowy swojego narzędzia. Ta umiejętność generuje ukierunkowane, jednofunkcyjne widgety, które wyświetlają wynik narzędzia wizualnie w rozmowie czatu. Wymaga opisu wizualizacji oraz wyniku testowego narzędzia w formacie JSON. Wygenerowany widget może być interaktywny, jeśli podana zostanie nazwa narzędzia, co umożliwia wywołanie narzędzia i odświeżenie danych.

Kluczowe funkcje

Generuje samodzielne widgety HTML
Obsługuje interaktywne widgety z funkcją callServerTool
Obsługuje różne typy danych z kontrolą typów
Zachęca do użycia Fluent UI oraz wytycznych projektowych w celu zachowania spójności wizualnej

Cennik

Model: Free
Kategoria: Umiejętności
Ocena: Brak recenzji

Zastosowania

Wizualizacja Wyników Narzędzia

Użytkownik chce zwizualizować wynik narzędzia jako wykres lub tabelę w rozmowie czatu. Dostarcza opis pożądanej wizualizacji oraz wynik testowy narzędzia w formacie JSON.

Interaktywny Dashboard

Użytkownik żąda interaktywnego widgetu, który wyświetla dane z narzędzia i umożliwia ich odświeżanie. Dostarcza nazwę narzędzia oraz wynik testowy.

Plusy i minusy

Plusy

Tworzy atrakcyjne wizualnie widgety do rozmów w czacie
Umożliwia interaktywne widgety z możliwością odświeżania
Zachęca do zwięzłych i skoncentrowanych wizualizacji danych

Minusy

Wymaga od użytkowników konkretnych danych wejściowych (opisu wizualizacji i wyniku testowego narzędzia)
Ogranicza się do generowania widgetów na podstawie dostarczonych danych, nie zakładając kształtu danych

Recenzje

Zaloguj się, aby zostawić recenzję.

Brak recenzji. Bądź pierwszy!

Pytania i odpowiedzi

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

Zadaj pytanie

Alternatywy dla Umiejętności

Using Git Worktrees (Grade A)Umiejętności

Skill zabezpieczony pod kątem bezpieczeństwa dla Claude AI, klasy A. Użyj przy rozpoczynaniu pracy nad funkcją wymagającej izolacji od bieżącego środowiska lub przed realizacją planów wdrożeniowych – tworzy izolowane worktree Git.

— (0)

Free

Ga4 Bigquery Schema (Grade A)Umiejętności

Sprawdzone pod kątem bezpieczeństwa narzędzie data‑ai dla Claude AI. Ocena A. Referencja schematu eksportu GA4 do BigQuery — pełna dokumentacja pól, struktury zagnieżdżone, wzorce zapytań oraz wskazówki dotyczące wydajności

— (0)

Free

Meta Capi (Grade A)Umiejętności

Przetestowana pod względem bezpieczeństwa umiejętność data-ai dla Claude AI. Ocena A. Meta Conversions API (CAPI) Konfiguracja odnośnika — architektura, typy zdarzeń, mieszanie informacji o klientach, deduplikacja, przykłady wdrożenia, AEM

— (0)

Free

Callees (Grade A)Umiejętności

Bezpieczna, przetestowana umiejętność programistyczna dla Claude AI. Klasa A. Lista funkcji/metod wywoływanych (bezpośredni wykres wywołań)

— (0)

Free

Test Module Name (Grade A)Umiejętności

Składnik data-ai przetestowany pod kątem bezpieczeństwa dla Claude AI. Klasa A.

— (0)

Free

Board Of Directors (Grade A)Umiejętności

Skutecznie przetestowana umiejętność AI do danych dla Claude AI. Klasa A. Symuluje deliberację 5‑członkowej rady ekspertów przy kluczowych decyzjach. Używaj przy ocenie planów, wyborów architektonicznych, projektów funkcji lub innych decyzji.

— (0)

Free

Advpl Mvc Avancado (Grade A)Umiejętności

Umiejętność programowania przetestowana pod względem bezpieczeństwa dla Claude AI. Klasa A. MVC zaawansowany via PE (Punkty Wejścia) — dodawanie niestandardowych siatek w standardowych ekranach MVC (CNTA300/MATA070/MATA440/MATA460/FINA040 via *STRU)

— (0)

Free

Docs Writer (Grade A)Umiejętności

Umiejętność DevOps testowana pod kątem bezpieczeństwa dla Claude AI. Poziom A. **UMIEJĘTNOŚĆ PRZEPŁYWU PRACY** — Utrzymuje dokładność i aktualność dokumentacji repozytorium na stronie dokumentacji, w plikach agenta i w changelogu. KIEDY: "update docs"

— (0)

Free