teefayb/claude-code-setup-demo

Ajoute un nouveau handler de route Next.js sous src/app/api avec validation Zod, erreurs cohérentes et tests Vitest. À utiliser lorsqu'on demande d'ajouter ou d'étendre un point de terminaison API.

Qu'est-ce que claude-code-setup-demo ?

Cette compétence pour agent IA automatise la création de routes API Next.js (App Router) en suivant une architecture cohérente : validation des entrées via Zod dans des schémas dédiés, accès aux données via des stores, et gestion d'erreurs uniforme. Elle est conçue pour les projets utilisant Next.js 14+, Zod, Vitest et un pattern de séparation des préoccupations. L'agent lit d'abord les fichiers existants pour se conformer aux conventions du projet (format d'erreur, localisation des schémas, etc.), puis génère le routeur, le fichier de test, et exécute la suite de tests (vitest, check, build). La compétence couvre tous les cas d'erreur typiques : JSON malformé, échec de validation Zod (avec `validationError`), ressource introuvable (404), et s'assure que les segments dynamiques sont correctement gérés avec `Promise<{ params }>`. Elle est particulièrement utile pour les développeurs qui souhaitent maintenir une base de code API homogène sans réinventer la structure à chaque nouveau endpoint.

Compatible avec✓Claude Code~Codex CLI~Cursor
npx skills add https://github.com/teefayb/claude-code-setup-demo/tree/HEAD/.claude/skills/add-api-route

Installed? Explore more Développement et programmation skills: steipete/bluebubbles, steipete/eightctl, steipete/blucli · View all 6 →

Demander à votre IA préférée

Ouvre une nouvelle conversation avec cette compétence d'agent déjà préchargée.

Documentation

Ajoute la route API décrite ici : $ARGUMENTS

Si la méthode, le chemin ou le comportement n'est pas clair, pose une courte question avant d'écrire du code.

Étapes

  1. Lis src/app/api/links/route.ts, src/lib/http.ts et src/lib/links/schema.ts pour correspondre aux motifs existants. N'invente pas un nouveau format d'erreur.
  2. Place la validation d'entrée dans un schéma Zod dans le fichier src/lib/<domain>/schema.ts approprié, pas en ligne dans la route.
  3. Place l'accès aux données dans src/lib/<domain>/store.ts. Le gestionnaire de route se contente d'analyser, d'appeler le store et de mapper les résultats en réponses.
  4. Crée src/app/api/<path>/route.ts :
    • export const dynamic = "force-dynamic";
    • JSON malformé → errorResponse(400, "invalid_json")
    • ZodError → validationError(err)
    • Non trouvé → errorResponse(404, "not_found")
    • Segments dynamiques : { params }: { params: Promise<{ id: string }> } et await params.
  5. Écris route.test.ts à côté de la route. Utilise useTempDataFile() depuis @/test/temp-data-file et appelle les gestionnaires exportés avec new Request(...). Couvre : succès, chaque classe d'échec de validation, non trouvé, et JSON malformé lorsqu'un corps est accepté.
  6. Exécute npx vitest run <le nouveau fichier de test>, puis npm run check, puis npm run build.
  7. Signale : le contrat du point de terminaison (méthode, chemin, corps de la requête, réponses avec codes d'état) et les commandes que tu as exécutées avec leur résultat.

Individual skills in this repo

This repo contains 4 individual skills — each has its own dedicated page.

Skills associés