CommunityProgramación y desarrollogithub.com

teefayb/claude-code-setup-demo

Agrega un nuevo manejador de ruta de Next.js en src/app/api con validación Zod, errores consistentes y pruebas Vitest. Úsalo cuando se te pida agregar o extender un endpoint de API.

¿Qué es claude-code-setup-demo?

Este skill permite a un agente de IA (como Claude Code) incorporar de manera estructurada nuevos endpoints de API en un proyecto Next.js siguiendo las convenciones existentes del código base. Cuando el usuario solicita agregar o extender una ruta de API, el agente lee ejemplos previos (`route.ts`, `lib/http.ts` y schemas) para replicar el patrón exacto, evitando inventar formatos de error nuevos. La validación de entrada se coloca en un archivo Zod separado (`schema.ts`), la lógica de acceso a datos en un store (`store.ts`) y el manejador de ruta solo se encarga de parsear, llamar al store y mapear respuestas. Además, se generan pruebas unitarias Vitest que cubren casos de éxito, cada clase de fallo de validación, recurso no encontrado y JSON mal formado. Finalmente, el agente ejecuta las pruebas, los chequeos de lint y build, y reporta el contrato del endpoint junto con los comandos ejecutados y sus resultados.

Compatible con✓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 Programación y desarrollo skills: steipete/bluebubbles, steipete/eightctl, steipete/blucli · View all 6 →

Preguntar en tu IA favorita

Abre un nuevo chat con esta habilidad de agente ya precargada.

Documentación

Agrega la ruta de API descrita aquí: $ARGUMENTS

Si el método, la ruta o el comportamiento no están claros, haz una pregunta corta antes de escribir código.

Pasos

  1. Lee src/app/api/links/route.ts, src/lib/http.ts y src/lib/links/schema.ts para seguir los patrones existentes. No inventes un nuevo formato de error.
  2. Coloca la validación de entrada en un esquema Zod en el archivo src/lib/<dominio>/schema.ts, no en línea dentro de la ruta.
  3. Coloca el acceso a datos en src/lib/<dominio>/store.ts. El manejador de ruta solo parsea, llama al store y mapea los resultados a respuestas.
  4. Crea src/app/api/<ruta>/route.ts:
    • export const dynamic = "force-dynamic";
    • JSON malformado → errorResponse(400, "invalid_json")
    • ZodError → validationError(err)
    • No encontrado → errorResponse(404, "not_found")
    • Segmentos dinámicos: { params }: { params: Promise<{ id: string }> } y await params.
  5. Escribe route.test.ts junto a la ruta. Usa useTempDataFile() de @/test/temp-data-file y llama a los manejadores exportados con new Request(...). Cubre: éxito, cada clase de fallo de validación, no encontrado y JSON malformado donde se acepte un cuerpo.
  6. Ejecuta npx vitest run <el nuevo archivo de prueba>, luego npm run check y luego npm run build.
  7. Reporta: el contrato del endpoint (método, ruta, cuerpo de la solicitud, respuestas con códigos de estado) y los comandos que ejecutaste con su resultado.

Individual skills in this repo

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

Skills relacionados