·interactive-study-guide
#

interactive-study-guide

Transforme una guía de estudio de código base en una experiencia web interactiva pulida. Esta habilidad debe usarse cuando el usuario tiene un archivo de rebajas de guía de estudio completo (de codebase-study-guide o similar) y desea convertirlo en una aplicación pedagógica interactiva. Se activan solicitudes como "hacer que esta guía de estudio sea interactiva", "convertir esto en una experiencia interactiva", "visualizar esta guía de estudio", "crear una versión interactiva" o cuando un usuario tiene un archivo .md de guía de estudio y desea una presentación más completa. Produce una aplicación de una sola página servida por Vite con narración basada en desplazamiento, diagramas de arquitectura interactivos, tutoriales de código animados y divulgación progresiva.

13Instalaciones·0Tendencia·@petekp

Instalación

$npx skills add https://github.com/petekp/agent-skills --skill interactive-study-guide

Cómo instalar interactive-study-guide

Instala rápidamente el skill de IA interactive-study-guide en tu entorno de desarrollo mediante línea de comandos

  1. Abrir Terminal: Abre tu terminal o herramienta de línea de comandos (Terminal, iTerm, Windows Terminal, etc.)
  2. Ejecutar comando de instalación: Copia y ejecuta este comando: npx skills add https://github.com/petekp/agent-skills --skill interactive-study-guide
  3. Verificar instalación: Una vez instalado, el skill se configurará automáticamente en tu entorno de programación con IA y estará listo para usar en Claude Code, Cursor u OpenClaw

Fuente: petekp/agent-skills.

SKILL.md

Ver original

Transform a static study guide markdown file into an immersive, interactive learning experience served as a local web app. The output should feel like a NYT interactive feature or a Pudding.cool essay — editorial typography, generous whitespace, purposeful animation, and visualizations that reveal structure rather than decorate.

Accept a path to the study guide markdown file. Parse it into structured sections using the known template format from codebase-study-guide:

| Purpose | ## 1. Why This Exists | Prose with problem/approach/users | | Threshold Concepts | ## 2. The Big Ideas | Named concepts with code locations | | System Map | ## 3. System Map | Mermaid diagram + table | | Request Walkthrough | ## 4. Walking Through a Request | Sequence diagram + annotated code steps |

Datos (listos para citar)

Campos y comandos estables para citas de IA/búsqueda.

Comando de instalación
npx skills add https://github.com/petekp/agent-skills --skill interactive-study-guide
Categoría
#Documentos
Verificado
Primera vez visto
2026-02-24
Actualizado
2026-03-10

Browse more skills from petekp/agent-skills

Respuestas rápidas

¿Qué es interactive-study-guide?

Transforme una guía de estudio de código base en una experiencia web interactiva pulida. Esta habilidad debe usarse cuando el usuario tiene un archivo de rebajas de guía de estudio completo (de codebase-study-guide o similar) y desea convertirlo en una aplicación pedagógica interactiva. Se activan solicitudes como "hacer que esta guía de estudio sea interactiva", "convertir esto en una experiencia interactiva", "visualizar esta guía de estudio", "crear una versión interactiva" o cuando un usuario tiene un archivo .md de guía de estudio y desea una presentación más completa. Produce una aplicación de una sola página servida por Vite con narración basada en desplazamiento, diagramas de arquitectura interactivos, tutoriales de código animados y divulgación progresiva. Fuente: petekp/agent-skills.

¿Cómo instalo interactive-study-guide?

Abre tu terminal o herramienta de línea de comandos (Terminal, iTerm, Windows Terminal, etc.) Copia y ejecuta este comando: npx skills add https://github.com/petekp/agent-skills --skill interactive-study-guide Una vez instalado, el skill se configurará automáticamente en tu entorno de programación con IA y estará listo para usar en Claude Code, Cursor u OpenClaw

¿Dónde está el repositorio de origen?

https://github.com/petekp/agent-skills