explanatory-playground
✓Erstellen Sie interaktive Debugging-Schnittstellen, die das interne Systemverhalten offenlegen. Verwenden Sie diese Option, wenn Sie dazu aufgefordert werden, „Mir zu helfen, zu verstehen, wie das funktioniert“, „Mir zu zeigen, was passiert“, „den Status zu visualisieren“, „eine Debug-Ansicht zu erstellen“, „Ich kann nicht sehen, was vor sich geht“ oder bei jeder Anfrage, um undurchsichtiges Systemverhalten sichtbar zu machen. Gilt für Zustandsmaschinen, Datenflüsse, Ereignissysteme, Algorithmen, Renderzyklen, Animationen, CSS-Berechnungen oder alle Mechanismen mit versteckten Interna.
Installation
SKILL.md
Build dev-only visualizations that make invisible system behavior visible.
| State machines | Node-edge graph | react-flow | | Data flow | Directed graph / Sankey | react-flow | | Events | Timeline | custom or recharts | | Algorithms | Step animation | custom | | Render cycles | Component tree + diffs | custom | | Animations | Timeline scrubber | custom | | CSS/Layout | Box model overlay | custom |
See references/patterns.md for layouts, code, and implementation details.
Erstellen Sie interaktive Debugging-Schnittstellen, die das interne Systemverhalten offenlegen. Verwenden Sie diese Option, wenn Sie dazu aufgefordert werden, „Mir zu helfen, zu verstehen, wie das funktioniert“, „Mir zu zeigen, was passiert“, „den Status zu visualisieren“, „eine Debug-Ansicht zu erstellen“, „Ich kann nicht sehen, was vor sich geht“ oder bei jeder Anfrage, um undurchsichtiges Systemverhalten sichtbar zu machen. Gilt für Zustandsmaschinen, Datenflüsse, Ereignissysteme, Algorithmen, Renderzyklen, Animationen, CSS-Berechnungen oder alle Mechanismen mit versteckten Interna. Quelle: petekp/claude-code-setup.
Fakten (zitierbereit)
Stabile Felder und Befehle für KI/Such-Zitate.
- Installationsbefehl
npx skills add https://github.com/petekp/claude-code-setup --skill explanatory-playground- Quelle
- petekp/claude-code-setup
- Kategorie
- {}Datenanalyse
- Verifiziert
- ✓
- Erstes Auftreten
- 2026-02-17
- Aktualisiert
- 2026-02-18
Schnelle Antworten
Was ist explanatory-playground?
Erstellen Sie interaktive Debugging-Schnittstellen, die das interne Systemverhalten offenlegen. Verwenden Sie diese Option, wenn Sie dazu aufgefordert werden, „Mir zu helfen, zu verstehen, wie das funktioniert“, „Mir zu zeigen, was passiert“, „den Status zu visualisieren“, „eine Debug-Ansicht zu erstellen“, „Ich kann nicht sehen, was vor sich geht“ oder bei jeder Anfrage, um undurchsichtiges Systemverhalten sichtbar zu machen. Gilt für Zustandsmaschinen, Datenflüsse, Ereignissysteme, Algorithmen, Renderzyklen, Animationen, CSS-Berechnungen oder alle Mechanismen mit versteckten Interna. Quelle: petekp/claude-code-setup.
Wie installiere ich explanatory-playground?
Öffnen Sie Ihr Terminal oder Kommandozeilen-Tool (Terminal, iTerm, Windows Terminal, etc.) Kopieren Sie diesen Befehl und führen Sie ihn aus: npx skills add https://github.com/petekp/claude-code-setup --skill explanatory-playground Nach der Installation wird der Skill automatisch in Ihrer KI-Programmierumgebung konfiguriert und ist bereit zur Verwendung in Claude Code oder Cursor
Wo ist das Quell-Repository?
https://github.com/petekp/claude-code-setup
Details
- Kategorie
- {}Datenanalyse
- Quelle
- skills.sh
- Erstes Auftreten
- 2026-02-17