codebase-to-course

Copy the skill folder into ~/.claude/skills/, open a project in Claude Code, and say "turn this codebase into an interactive course." You can also provide a GitHub link, which gets cloned before analysis begins.

The output is a directory containing styles.css, main.js, per-module HTML files, and an assembled index.html. It opens directly in a browser with no setup, and the only external dependency is the Google Fonts CDN.

Yes. Provide a GitHub URL and the skill clones the repo to a temporary directory with git clone before starting the codebase analysis phase. Local folders and the current working directory also work.

The course targets vibe coders who build software with AI coding tools without a traditional CS background. It assumes zero technical knowledge, explains every term with glossary tooltips, and focuses on practical skills like debugging and steering AI assistants.

For complex codebases needing 6 or more modules, it writes a brief per module with pre-extracted code snippets, then dispatches subagents in batches of up to 3 to write modules in parallel. Simple codebases use a sequential single-context build.

Tooltips get clipped when containers use overflow hidden, so main.js positions them with position fixed appended to document.body. Flow animations break if step labels contain single quotes, since the data-steps attribute is single-quote delimited.