Codebase to Course

Установка

git clone https://github.com/zarazhangrui/codebase-to-course ~/.claude/skills/codebase-to-course

Это чужой код. Посмотрите файлы в репозитории перед установкой.

Что делает

Агент читает проект из текущей папки или по ссылке на GitHub и разбирается, как части кода связаны между собой. Затем собирает курс из отдельных модулей: настоящий код рядом с объяснением на простом языке, анимированные схемы потоков данных, подсказки к терминам и вопросы на применение знаний. Результат это папка со стилями, скриптом и index.html, которая открывается в браузере без сборки. Фрагменты кода берутся из проекта без изменений, чтобы их можно было найти в исходниках.

Для кого. Для тех, кто собирает проекты с помощью AI без инженерного образования и хочет понимать свой код.

Пример запроса к агенту

Сделай из этого проекта интерактивный курс, объясняй на русском

Ограничения

Тексты курса пишутся на английском, если не попросить иначе. Готовый курс грузит шрифты с Google Fonts. Для больших репозиториев генерация занимает много токенов. В репозитории не указана лицензия.

Как отключить. Удалите папку codebase-to-course из ~/.claude/skills/.

Проверка безопасности

• Только инструкции и шаблоны, читает файлы проекта и пишет HTML в отдельную папку

Коротко о README

README описывает целевую аудиторию, из чего состоит курс и принципы подачи: сначала практика, больше визуального, тесты на применение, свои метафоры для каждого понятия и только оригинальный код. Установка сводится к копированию папки в каталог скиллов Claude Code, приведены фразы для запуска. В структуре SKILL.md и два справочника: дизайн-система и интерактивные элементы.

SKILL.md

---
name: codebase-to-course
description: "Turn any codebase into a beautiful, interactive single-page HTML course that teaches how the code works to non-technical people. Use this skill whenever someone wants to create an interactive course, tutorial, or educational walkthrough from a codebase or project. Also trigger when users mention 'turn this into a course,' 'explain this codebase interactively,' 'teach this code,' 'interactive tutorial from code,' 'codebase walkthrough,' 'learn from this codebase,' or 'make a course from this project.' This skill produces a stunning, self-contained HTML file with scroll-based navigation, animated visualizations, embedded quizzes, and code-with-plain-English side-by-side translations."
---

# Codebase-to-Course

Transform any codebase into a stunning, interactive course. The output is a **directory** containing a pre-built `styles.css`, `main.js`, per-module HTML files, and an assembled `index.html` — open it directly in the browser with no setup required (only external dependency: Google Fonts CDN). The course teaches how the code works through scroll-based modules, animated visualizations, embedded quizzes, and plain-English translations of code.

## First-Run Welcome

When the skill is first triggered and the user hasn't specified a codebase yet, introduce yourself and explain what you do:

> **I can turn any codebase into an interactive course that teaches how it works — no coding knowledge required.**
>
> Just point me at a project:
> - **A local folder** — e.g., "turn ./my-project into a course"
> - **A GitHub link** — e.g., "make a course from https://github.com/user/repo"
> - **The current project** — if you're already in a codebase, just say "turn this into a course"
>
> I'll read through the code, figure out how everything fits together, and generate a beautiful single-page HTML course with animated diagrams, plain-English code explanations, and interactive quizzes. The whole thing runs in your browser — no setup needed.

If the user provides a GitHub link, clone the repo first (`git clone <url> /tmp/<repo-name>`) before starting the analysis. If they say "this codebase" or similar, use the current working directory.

## Who This Is For

The target learner is a **"vibe coder"** — someone who builds software by instructing AI coding tools in natural language, without a traditional CS education. They may have built this project themselves (without looking at the code), or they may have found an interesting open-source project on GitHub and want to understand how it's built. Either way, they don't yet understand what's happening under the hood.

Похожие