/ Annuaire / Playground / Codebase to Course
● Communauté zarazhangrui ⚡ Instantané

Codebase to Course

par zarazhangrui · zarazhangrui/codebase-to-course

Pointez vers un dépôt, obtenez un « cours » HTML expliquant comme un tutoriel — code annoté, diagrammes, narration — pour les non-ingénieurs et les nouvelles recrues.

codebase-to-course est un skill Claude Code qui parcourt un dépôt entier et produit un cours HTML fichier unique expliquant comment la base de code fonctionne réellement. Il est structuré comme un tutoriel : vue d'ensemble de l'architecture, puis approfondissements par module, puis des walkthroughs « suivez cette requête à travers le système » — avec des extraits de code annotés intégrés. La sortie est un seul fichier HTML, sans étape de build.

Pourquoi l'utiliser

Fonctionnalités clés

Démo en direct

Aperçu en pratique

prêt

Installer

Choisissez votre client

~/Library/Application Support/Claude/claude_desktop_config.json  · Windows: %APPDATA%\Claude\claude_desktop_config.json
{
  "mcpServers": {
    "codebase-to-course-skill": {
      "command": "git",
      "args": [
        "clone",
        "https://github.com/zarazhangrui/codebase-to-course",
        "~/.claude/skills/codebase-to-course"
      ],
      "_inferred": true
    }
  }
}

Ouvrez Claude Desktop → Settings → Developer → Edit Config. Redémarrez après avoir enregistré.

~/.cursor/mcp.json · .cursor/mcp.json
{
  "mcpServers": {
    "codebase-to-course-skill": {
      "command": "git",
      "args": [
        "clone",
        "https://github.com/zarazhangrui/codebase-to-course",
        "~/.claude/skills/codebase-to-course"
      ],
      "_inferred": true
    }
  }
}

Cursor utilise le même schéma mcpServers que Claude Desktop. La config projet l'emporte sur la globale.

VS Code → Cline → MCP Servers → Edit
{
  "mcpServers": {
    "codebase-to-course-skill": {
      "command": "git",
      "args": [
        "clone",
        "https://github.com/zarazhangrui/codebase-to-course",
        "~/.claude/skills/codebase-to-course"
      ],
      "_inferred": true
    }
  }
}

Cliquez sur l'icône MCP Servers dans la barre latérale Cline, puis "Edit Configuration".

~/.codeium/windsurf/mcp_config.json
{
  "mcpServers": {
    "codebase-to-course-skill": {
      "command": "git",
      "args": [
        "clone",
        "https://github.com/zarazhangrui/codebase-to-course",
        "~/.claude/skills/codebase-to-course"
      ],
      "_inferred": true
    }
  }
}

Même format que Claude Desktop. Redémarrez Windsurf pour appliquer.

~/.continue/config.json
{
  "mcpServers": [
    {
      "name": "codebase-to-course-skill",
      "command": "git",
      "args": [
        "clone",
        "https://github.com/zarazhangrui/codebase-to-course",
        "~/.claude/skills/codebase-to-course"
      ]
    }
  ]
}

Continue utilise un tableau d'objets serveur plutôt qu'une map.

~/.config/zed/settings.json
{
  "context_servers": {
    "codebase-to-course-skill": {
      "command": {
        "path": "git",
        "args": [
          "clone",
          "https://github.com/zarazhangrui/codebase-to-course",
          "~/.claude/skills/codebase-to-course"
        ]
      }
    }
  }
}

Ajoutez dans context_servers. Zed recharge à chaud à la sauvegarde.

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

Une seule ligne. Vérifiez avec claude mcp list. Supprimez avec claude mcp remove.

Cas d'usage

Usages concrets : Codebase to Course

Générer un cours d'onboarding autodidacte pour un nouveau recruté

👤 Responsables d'ingénierie / tech leads ⏱ ~45 min beginner

Quand l'utiliser : Vendredi après acceptation de l'offre : vous voulez un vrai artefact d'onboarding au lieu de « va lire le code ».

Prérequis
  • Skill installé — git clone https://github.com/zarazhangrui/codebase-to-course ~/.claude/skills/codebase-to-course
  • Dépôt cloné — git clone standard
Déroulement
  1. Scanner le dépôt
    codebase-to-course : scanne ./our-app. Propose d'abord la structure du cours — liste des sections — avant d'écrire.✓ Copié
    → Table des matières concrète : architecture, modules, flux de requêtes
  2. Générer le cours
    C'est bon. Génère le HTML complet vers /onboarding/course.html. Public cible : nouveau développeur full-stack qui connaît React + Node mais pas notre domaine.✓ Copié
    → Fichier HTML généré ; s'ouvre dans le navigateur
  3. Vérifier la précision
    Vérification ponctuelle : est-ce que le walkthrough 'flux d'auth' correspond à ce qui est réellement dans src/auth/ ? Cite le code réel.✓ Copié
    → Le walkthrough cite des chemins de fichiers réels et du code actuel

Résultat : Un vrai artefact d'onboarding qui économise 2 semaines d'explications à l'équipe.

Pièges
  • Le cours est trop long à vraiment lire — Spécifiez le nombre maximum de sections ; la qualité prime sur l'exhaustivité
  • Les extraits de code deviennent obsolètes — Régénérez après les grands refactorings ; le skill est rapide
Combiner avec : filesystem · git-mcp-idosal

Expliquer une fonctionnalité complexe à un PM non technique

👤 Tech leads ⏱ ~20 min beginner

Quand l'utiliser : Le PM demande sans cesse « pourquoi ça prend 3 sprints » — vous voulez un artefact concret.

Déroulement
  1. Cibler la fonctionnalité
    codebase-to-course : cible src/payments/. Public : PM sans background ingénierie. Penchant pour les diagrammes + analogies, léger en code.✓ Copié
    → Le cours est de haut niveau ; blocs de code minimaux

Résultat : Le PM repart avec un modèle mental.

Pièges
  • Les analogies surimposent — Vérification ponctuelle ; le skill préfère la précision si on le pousse

Générer une page « comment ça fonctionne » pour votre projet open source

👤 Mainteneurs OSS ⏱ ~30 min intermediate

Quand l'utiliser : Votre README liste les fonctionnalités mais n'a pas d'explication architecturale.

Déroulement
  1. Générer comme page de docs
    codebase-to-course : scanne la branche main. Génère ARCHITECTURE.html pour le site de docs. Cible : développeurs expérimentés évaluant le projet.✓ Copié
    → Le résultat se lit comme un guide contributeur réfléchi

Résultat : Meilleure expérience développeur pour les évaluateurs et contributeurs.

Pièges
  • Le cours semble générique (paraît générique) — Passez le nom du projet + des indicateurs de style dans le prompt

Combinaisons

Associez-le à d'autres MCPs pour un effet X10

codebase-to-course-skill + filesystem

Lire le dépôt local et écrire le cours

codebase-to-course : scanne ./our-app, écris /onboarding/course.html.✓ Copié
codebase-to-course-skill + git-mcp-idosal

Créer un cours pour un dépôt externe sans le cloner

Utilise GitMCP pour owner/repo. Puis codebase-to-course par-dessus.✓ Copié

Outils

Ce que ce MCP expose

OutilEntréesQuand appelerCoût
scan_repo path Toujours en premier 0
propose_toc scan_result, audience Après scan, avant génération 0
generate_course scan_result, toc, target_html_path Étape finale 0
scope_to_subdir subdir_path Grand monorepo ou focus fonctionnalité 0

Coût et limites

Coût d'exécution

Quota d'API
N/A
Tokens par appel
Significatif — le skill lit le dépôt entier (typiquement 10k–50k tokens)
Monétaire
Gratuit ; vos tokens de modèle s'appliquent
Astuce
Pour les monorepos, utilisez scope_to_subdir ; ne créez pas de cours pour tout à la fois

Sécurité

Permissions, secrets, portée

Portées minimales : filesystem-read filesystem-write
Stockage des identifiants : Aucun
Sortie de données : Aucun — lecture/écriture purement locale

Dépannage

Erreurs courantes et correctifs

Le cours est trop générique / ne référence pas le code réel

Rendez le prompt plus spécifique ; demandez des citations fichier:ligne

Dépôt trop grand ; manque de contexte

Utilisez scope_to_subdir ; faites des cours par module et liez-les

Formatage HTML cassé

Demandez au skill de valider la sortie ; régénérez si nécessaire

Alternatives

Codebase to Course vs autres

AlternativeQuand l'utiliserCompromis
Repomix + prompt manuelVous voulez un contrôle total sur la façon dont la base de code est fournie à ClaudePlus de configuration ; pas de format de sortie opinioné
DocsGPT / MintlifyVous voulez des docs hébergéesProduit différent entièrement ; pas HTML fichier unique
absolutely-skilled / autodocVous voulez des docs API auto-généréesRéférence API ≠ tutoriel

Plus

Ressources

📖 Lire le README officiel sur GitHub

🐙 Voir les issues ouvertes

🔍 Parcourir les 400+ serveurs MCP et Skills