Tutoriel des sous-agents Claude Code : construisez votre équipe d'IA
Suivez la démo de Developers Digest image par image : créez des sous-agents avec l'assistant /agents, donnez à chacun ses outils et son prompt système, puis regardez un agent de recherche et un agent front-end construire une landing page ensemble.
En bref
- Tapez /agents dans Claude Code pour ouvrir le panneau des agents et créer votre premier sous-agent en une minute environ.
- Chaque sous-agent est un fichier markdown unique dans .claude/agents/ avec un nom, une description, une liste d'outils et un prompt système.
- Générez les agents avec Claude, calez leurs outils — y compris les serveurs MCP comme Firecrawl ou Context7 — et choisissez une couleur de terminal.
- Dans la démo, un sous-agent de recherche web et un sous-agent front-end Next.js recherchent l'actualité IA et construisent une landing page SaaS de bout en bout.
Claude Code NEW Sub Agents in 7 Minutes
Source vidéo:Developers Digest7:10
Create subagents — Claude Code official docs
Documentation officielle ·:Anthropic
Les captures d'écran proviennent du walkthrough de Developers Digest ; la terminologie et les conventions de fichiers ont été vérifiées auprès de la documentation officielle d'Anthropic sur les sous-agents.
Toutes les captures d'écran restent la propriété de Developers Digest et servent ici à illustrer le tutoriel ; les horodatages renvoient vers la vidéo d'origine.
Créer des sous-agents Claude Code, étape par étape
Partie 1 · Créer votre premier sous-agent avec /agents
- 1
Ouvrez le panneau des agents avec /agents
Dans une session Claude Code, tapez /agents puis choisissez Create new agent. Le panneau liste tous vos sous-agents ainsi que l'agent intégré general-purpose, toujours disponible.
Une seule commande slash suffit pour atteindre le gestionnaire d'agents.Voir à 0:30 - 2
Choisissez la portée projet ou personnelle
L'étape 1 demande où vivra l'agent : Project (.claude/agents/) le garde dans le dépôt, tandis que Personal (~/.claude/agents/) le rend disponible dans tous les projets de votre machine.
Les agents de projet peuvent être committés ; les agents personnels vous suivent partout.Voir à 0:46 - 3
Laissez Claude générer l'agent
L'étape 2 propose Generate with Claude (recommandé) ou Manual configuration. Dans la vidéo, on demande un spécialiste front-end expert de Next.js, Tailwind et ShadCN/UI, et Claude rédige toute la configuration.
Décrivez le rôle en une phrase et Claude écrit le fichier pour vous.Voir à 1:05 - 4
Cadrer l'accès aux outils
L'étape 4 regroupe tout ce que l'agent peut manipuler : All tools, Read-only tools, Edit tools, Execution tools et MCP & Other tools. Désactivez des outils un à un, ou tout autoriser comme dans la démo.
Un agent front-end peut tout avoir ; un agent back-end n'aura peut-être que la base de données et les logs.Voir à 1:36 - 5
Donnez-lui une couleur de terminal
Choisissez une couleur de fond dans la palette — Red, Blue, Green, Orange, Yellow, Purple, Pink, Cyan ou Automatic — et l'aperçu montre la puce du nom de l'agent dans la conversation.
Les couleurs montrent d'un coup d'œil quel spécialiste s'exécute.Voir à 1:48 - 6
Vérifiez le prompt généré et enregistrez
L'écran de confirmation affiche la description que Claude utilisera pour décider quand déléguer, le prompt système complet et des avertissements — dans la démo, la description dépasse 400 caractères. Appuyez sur Entrée pour enregistrer.
Chaque champ reste modifiable plus tard ; le fichier est un simple markdown.Voir à 2:15
Partie 2 · Les fichiers d'agents et un deuxième spécialiste
- 7
Trouvez le fichier markdown dans .claude/agents
Chaque sous-agent tient dans un fichier markdown. La démo ouvre le projet dans Finder et montre le dossier caché .claude/agents avec nextjs-tailwind-shadcn-engineer.md — assez portable pour être commité dans le dépôt.
Le dossier apparaît dès que votre premier agent est enregistré.Voir à 3:10 - 8
Ajoutez un spécialiste de la recherche web
Reprenez le processus pour un second agent. Cette fois, ne cochez que les outils MCP dont il a besoin : scrape, map et search du serveur Firecrawl — le compteur affiche 3 outils sur 25 sélectionnés.
Des listes d'outils étroites gardent chaque agent concentré et prévisible.Voir à 3:36 - 9
Vérifiez le frontmatter avant d'enregistrer
L'écran de confirmation liste Name: web-research-specialist, Location: .claude/agents/web-research-specialist.md, les trois outils mcp__mcp-server-firecrawl__, la description et le prompt système.
Claude rédige le frontmatter et le corps ; vous pouvez les ajuster à tout moment.Voir à 3:42
Partie 3 · Déléguer une construction avec recherche
- 10
Déléguez une vraie construction
Demandez une landing page SaaS avec un tableau de tarifs et une FAQ, et une section principale qui recherche les cinq principales actualités IA de juillet 2025 — en demandant à Claude d'explorer le web avant d'écrire la moindre ligne de code.
Un seul prompt se répartit aussitôt dans l'équipe que vous venez de créer.Voir à 4:26 - 11
Observez Claude orchestrer l'équipe
Claude décompose la requête en un plan multi-étapes, décide de lancer d'abord l'agent web-research-specialist, confie ensuite la construction à l'agent nextjs-tailwind-shadcn-engineer et suit tout dans une liste de tâches.
Les descriptions de chaque frontmatter indiquent à Claude quand déléguer.Voir à 4:28 - 12
Récupérez les résultats de la recherche
web-research-specialist termine après 10 utilisations d'outils et 22,5k tokens en environ deux minutes, et Claude Code barre l'élément de recherche dans la liste avant de passer à la suite.
Les faits frais entrent directement dans la conversation principale comme contexte.Voir à 4:38
Partie 4 · La phase de construction et le résultat
- 13
Laissez l'agent front-end construire
L'agent nextjs-tailwind-shadcn-engineer prend le relais : il écrit les fichiers d'application et de composants, la configuration et lance npm run dev pendant que la conversation principale affiche un statut marinating.
Les modifications de fichiers lourdes se font dans le propre contexte du sous-agent.Voir à 4:45 - 14
Examinez le site terminé
Résultat : une landing page Developer's Digest avec un hero construit à partir des cinq actualités IA recherchées, un tableau de tarifs à trois paliers, un accordéon FAQ fonctionnel et le mode sombre — exactement ce qui avait été délégué.
Les spécialistes ont construit ; votre conversation principale est restée concentrée.Voir à 6:12
Un méga prompt contre une équipe de sous-agents
| Capacité | Un seul méga prompt système | Équipe de sous-agents |
|---|---|---|
| Contexte | Une seule conversation accumule tout et finit par dériver. | Chaque sous-agent travaille dans sa propre fenêtre de contexte propre. |
| Instructions | Toutes les règles doivent être entassées dans un prompt unique. | Chaque agent reçoit un prompt système dédié que vous pouvez enrichir avec le temps. |
| Outils | Tous les outils restent disponibles en permanence. | Des listes blanches par agent, y compris des serveurs MCP comme Firecrawl ou Context7. |
| Réutilisation | Les instructions se copient-collent à la main entre projets. | Des fichiers markdown à committer dans le dépôt ou à installer globalement. |