claude-code-showcase: la configuración «lista para copiar» que nació de un comentario en Hacker News

Una configuración de ejemplo, «listo para copiar», para Claude Code: memoria de proyecto, hooks, skills, agentes, comandos, servidores MCP y flujos de GitHub Actions, todo en un solo repositorio.

Aclaración de desambiguación: el repositorio se llama simplemente claude-code-showcase y no debe confundirse con la abundante cantidad de contenido genérico de YouTube titulado «Claude Code Tutorial/Course» ni con los proyectos obra/superpowers (metodología de skills) o las listas awesome-claude-code. Este informe documenta únicamente el repositorio ChrisWiles/claude-code-showcase, un ejemplo concreto de configuración de proyecto, no un paquete instalable ni un framework.

Origen

El repositorio fue creado el 6 de enero de 2026 por Christopher Wiles (ChrisWiles), un desarrollador full-stack centrado en el ecosistema React/Node, con cuenta en GitHub desde 2014 y residencia en Austin (Texas), según su perfil. Todo el contenido se publicó ese mismo día: los 4 commits del repositorio (el inicial y un segundo «feat: add MCP servers, LSP support, and /ticket command») llevan fecha del 6 de enero de 2026, entre las 18:50 y las 19:05 UTC, y el único contribuidor registrado es el propio autor.

El detonante narrativo quedó documentado en Hacker News. En el hilo 46515696 —«Opus 4.5 is not the normal AI agent experience that I have had thus far», publicado por tbassetto y que alcanzó 879 puntos y 123 comentarios—, el usuario OldGreenYodaGPT escribió el 6 de enero de 2026 a las 18:13 UTC (comentario id 46516157) un texto largo describiendo cómo su equipo usa Claude Code con skills, agentes de revisión de código, workflows programados en GitHub y triaje de tickets. El comentario termina con la nota «Edit: made an example repo for ya» y enlaza directamente al repositorio. La primera línea de ese comentario —«Most software engineers are seriously sleeping on how good LLM agents are right now, especially something like Claude Code»— es, literalmente, la línea de apertura del README, lo que confirma que el repositorio es la materialización de aquel comentario.

Hay dos anécdotas que aportan color a la génesis: el propio autor reconoce que el comentario lo dictó por voz y lo dejó redactar a Claude («used voice to text then had claude reword, I am lazy and not gonna hand write it all for yall sorry!»), y el comentario cerraba con una profecía de tono alarmista: «There is so much low-hanging fruit here that it honestly blows my mind people aren’t all over it. 2026 is going to be a wake-up call.»

Caveat sobre la identidad: el usuario de Hacker News es OldGreenYodaGPT, no ChrisWiles. La atribución a Christopher Wiles es inferida y no una verificación directa de cuenta: la coincidencia de texto literal entre el comentario y el README, el enlace exacto al repositorio y la fecha idéntica hacen que sea prácticamente seguro que es la misma persona, pero no hay una declaración explícita del autor vinculando ambos handles.

Filosofía y principios

El README no declara principios como una lista formal, pero su argumentación de apertura sintetiza la filosofía del proyecto: el «desbloqueo real» son los skills reutilizables y unos pocos agentes («The real unlock is building a solid set of reusable “skills” plus a few “agents” for the stuff you do all the time.»). La idea central es que un Claude Code sin configuración es un compañero de equipo con superpoderes pero sin conocer tus convenciones; con skills, «already matches our patterns and standards out of the box».

Otros pilares: automatizar lo repetitivo con hooks (formatear el código, correr tests cuando cambia un archivo de test, hacer type-check de TypeScript y bloquear ediciones sobre la rama main deben ser comportamiento automático, no recordatorio humano); mantener el mantenimiento «en piloto automático» (la mayor parte del trabajo de calidad y mantenimiento se delega a agentes programados en GitHub Actions); e integrar el sistema de tickets como fuente de verdad (a través de servidores MCP, Claude puede leer un ticket, entender los criterios de aceptación, implementar, actualizar el estado del ticket y crear nuevos tickets si encuentra bugs).

En la práctica la filosofía es la de una plantilla de buenas prácticas: no aporta un modelo ni una runtime, aporta una estructura de directorios y archivos que el usuario replica en su propio proyecto.

Cómo funciona

El repositorio modela la estructura de un proyecto React/TypeScript configurado para Claude Code.

CLAUDE.md (memoria de proyecto): se carga automáticamente al iniciar sesión. Documenta el stack, comandos clave (npm test, npm run lint, npm run build), directorios, estilo de código (TypeScript estricto, preferir interface sobre type, prohibir any), convenciones de git (nombres de rama {iniciales}/{descripción}, Conventional Commits) y reglas críticas (manejo de errores, estados de UI, mutaciones). El README documenta tres localizaciones con orden de precedencia: .claude/CLAUDE.md, ./CLAUDE.md y ~/.claude/CLAUDE.md (nivel de usuario).

.claude/settings.json (hooks y entorno): define variables de entorno (INSIDE_CLAUDE_CODE, BASH_DEFAULT_TIMEOUT_MS) y los hooks. Los eventos documentados son PreToolUse, PostToolUse, UserPromptSubmit y Stop. El ejemplo incluye un PreToolUse (matcher Edit|MultiEdit|Write) que bloquea ediciones en la rama main y devuelve un mensaje pidiendo crear una rama de característica; un PostToolUse que auto-formatea JS/TS con npx prettier --write, auto-instala dependencias cuando cambia package.json, corre tests relacionados cuando cambia un archivo *.test.* y hace type-check de TypeScript con npx tsc --noEmit; y un UserPromptSubmit que dispara el sistema de evaluación de skills (skill-eval.sh).

.claude/skills/ (conocimiento de dominio): seis skills con su SKILL.md: testing-patterns (Jest, TDD, funciones fábrica, mocking), systematic-debugging (metodología de depuración en cuatro fases), react-ui-patterns (estados de carga/error/vacío, hooks de GraphQL), graphql-schema (consultas, mutaciones, codegen), core-components (sistema de diseño, tokens) y formik-patterns (formularios, validación, envío). Cada SKILL.md usa frontmatter con name y description (el campo que Claude usa para decidir cuándo aplicar la skill) y secciones estándar «When to Use / Core Patterns / Anti-Patterns / Integration».

.claude/agents/ (agentes especializados): code-reviewer.md (revisión exhaustiva con checklist: sin any, manejo de errores, estados de UI, orden Error → Loading → Empty → Success) y github-workflow.md (commits, ramas, PRs). .claude/commands/ (comandos slash): /onboard, /pr-review, /pr-summary, /code-quality, /docs-sync y /ticket. El comando /ticket orquesta un flujo extremo a extremo: leer el ticket por MCP, explorar el código, crear rama, implementar con TDD, actualizar el ticket, crear el PR y enlazarlo, y crear un ticket nuevo si aparece un bug.

Sistema de evaluación de skills (.claude/hooks/skill-eval.js + skill-rules.json): un motor que analiza cada prompt enviado (palabras clave, patrones regex, rutas de archivo, intención) y sugiere qué skills activar, con puntuación de confianza (keyword=2, keywordPattern=3, pathPattern=4, directoryMatch=5, intentPattern=4). .mcp.json (integraciones MCP): declara servidores para JIRA, GitHub, Linear, Sentry, Postgres, Slack, Notion y Memory. LSP servers: habilita inteligencia de código en tiempo real (diagnostics, tipos, navegación) a través de plugins como typescript-lsp, pyright-lsp y rust-lsp.

GitHub Actions (.github/workflows/): cuatro flujos que usan anthropics/claude-code-action@beta con el modelo claude-opus-4-5-20251101:

Workflow	Programa	Función
`pr-claude-code-review.yml`	Por PR / mención `@claude`	Revisión automática de PR contra la checklist del agente
`scheduled-claude-code-docs-sync.yml`	Mensual (día 1)	Alinea la documentación con los cambios de código
`scheduled-claude-code-quality.yml`	Semanal (domingo)	Revisa directorios aleatorios y auto-corrige
`scheduled-claude-code-dependency-audit.yml`	Quincenal (días 1 y 15)	Actualiza dependencias con verificación de tests

El ecosistema

Repositorios del autor (Christopher Wiles)

El autor tiene pocas contribuciones relevantes más allá de este repositorio; la mayoría de sus otros repos son personales. Los relacionados con la misma línea de pensamiento: ChrisWiles/how-we-build-now — un ensayo sobre ingeniería de software nativa-IA («why verification became the constraint»), publicado en septiembre de 2026, comparte la tesis del showcase: la verificación y las pruebas son el cuello de botella del flujo agente (0 estrellas); y ChrisWiles/wiles-wiki — wiki personal (Obsidian + skills de obsidian-wiki + Quartz, desplegado a GitHub Pages, 1 estrella), que no es un compañero directo del showcase. Los demás repos del autor (guías de pickleball, itinerarios de viaje, análisis bursátil) no guardan relación con Claude Code.

Puertos y forks de la comunidad

joeangel/gemini-showcase — 6 estrellas, creado el 12 de enero de 2026. Es un puerto al Gemini CLI: «Comprehensive Gemini CLI project configuration with hooks, skills, agents, commands, and GitHub Actions workflows». Nació como respuesta directa a la issue #1, donde nvictor preguntó cómo adaptar el showcase a Gemini CLI y joeangel respondió construyendo este punto de partida. Es el único puerto no-idiomático/verificable encontrado en esta investigación.

Listas curadas que lo incluyen

ithiria894/awesome-claude-code-workflows — 120 estrellas, 26 forks, creado el 23 de marzo de 2026. Es una lista curada de «recetas» de workflow que combinan hooks, servidores MCP, skills, agentes y CLAUDE.md. El showcase aparece allí, según lo anuncia la issue #15, precisamente porque demuestra «patrones de workflow reales y funcionales (no solo herramientas sueltas)».

Proyectos adyacentes que el showcase extiende o depende

anthropics/claude-code-action — 8 844 estrellas, 2 135 forks, creado el 19 de mayo de 2025. Es la GitHub Action oficial de Anthropic que todos los workflows del showcase invocan (anthropics/claude-code-action@beta). Sin este proyecto los flujos programados no funcionarían. modelcontextprotocol/servers — 90 241 estrellas. El repositorio de servidores MCP oficiales del ecosistema Model Context Protocol, del cual el .mcp.json del showcase se inspira (aunque con un matiz importante detallado en «Trampas frecuentes»).

Estas cifras provienen de la API de GitHub consultada el 11 de septiembre de 2026 y no son una auditoría de soporte ni de calidad de cada derivado.

Estado oficial / semioficial

El showcase no tiene estatus oficial de Anthropic ni de ningún vendor. No aparece en ningún marketplace oficial de plugins, no cuenta con una licencia formal y no es una especificación ni un paquete. Lo que sí documenta: inclusión comunitaria verificable en la lista curada ithiria894/awesome-claude-code-workflows (issue #15), mantenida por la comunidad, no por un vendor; dependencia de componentes oficiales, ya que todos sus flujos CI usan la GitHub Action oficial anthropics/claude-code-action y su modelo MCP se alinea con el ecosistema modelcontextprotocol; y una adopción de facto como plantilla, con 6 062 estrellas en menos de 8 meses y un solo autor, funcionando como referencia de facto para «cómo debería verse un proyecto React/TypeScript configurado para Claude Code». Ninguna fuente consultada lo designa como estándar formal, y la ausencia de licencia limita jurídicamente su reutilización (ver trampas).

Guía rápida de uso

Este proyecto es una plantilla de configuración, no un paquete instalable. No hay npm install del showcase en sí: el flujo es clonarlo y copiar los archivos de configuración a tu propio proyecto.

Instalación y primer arranque

Prerrequisitos: Claude Code instalado y funcionando, git, Node.js/npx, y (para los workflows) la variable ANTHROPIC_API_KEY guardada en los secrets del repositorio. El README sugiere la estructura objetivo:

your-project/
├── CLAUDE.md                      # Memoria de proyecto
├── .mcp.json                      # Config de servidores MCP
├── .claude/
│   ├── settings.json              # Hooks, entorno, permisos
│   ├── settings.local.json        # Overrides personales (gitignored)
│   ├── agents/                    # Agentes personalizados
│   ├── commands/                  # Comandos slash
│   ├── hooks/                     # Scripts de hooks
│   └── skills/                    # Conocimiento de dominio
└── .github/workflows/             # Flujos de GitHub Actions

Crear la estructura mínima (Quick Start del README):

mkdir -p .claude/{agents,commands,hooks,skills}

Después: añadir CLAUDE.md en la raíz con el stack, comandos, directorios y reglas del proyecto; añadir .claude/settings.json con los hooks (formateo, tests, protección de rama); y añadir tu primera skill en .claude/skills/<nombre>/SKILL.md. En el primer arranque, Claude Code carga automáticamente CLAUDE.md al iniciar la sesión y aplica los hooks de settings.json a cada edición.

Flujos de trabajo habituales

Trabajar un ticket de JIRA/Linear de punta a punta: ejecuta /ticket PROJ-123. Claude lee el ticket por MCP, busca los archivos relacionados, crea la rama {iniciales}/{ticket-id}-{descripción}, implementa con TDD, actualiza el estado del ticket a «In Review» y crea el PR enlazado.
Revisión de PR automatizada: al abrir o sincronizar un PR, el workflow pr-claude-code-review.yml (o una mención @claude) ejecuta la revisión contra la checklist de .claude/agents/code-reviewer.md y publica feedback agrupado por severidad.
Barrido de calidad semanal: scheduled-claude-code-quality.yml elige directorios aleatorios de src/, los revisa y auto-corrige los problemas claros, creando un PR si hizo cambios.
Sincronización de documentación mensual: scheduled-claude-code-docs-sync.yml lee los commits de los últimos 30 días, encuentra documentación desactualizada y solo corrige lo que está roto.

Configuración esencial

Los 5 archivos que un usuario nuevo toca primero: CLAUDE.md (memoria del proyecto), .claude/settings.json (hooks y variables de entorno), .claude/skills/<nombre>/SKILL.md (conocimiento de dominio, donde el campo description decide cuándo se activa), .claude/hooks/skill-rules.json (reglas de activación de skills) y .mcp.json (servidores MCP y sus variables de entorno).

Trampas frecuentes y soluciones

El .mcp.json referencia paquetes que no existen en npm. Los 8 servidores declarados usan el scope @anthropic/mcp-*. Todos devuelven HTTP 404 en el registro npm (comprobado uno a uno). Solución: tratar el .mcp.json como pseudocódigo/ilustrativo y sustituir cada entrada por un servidor MCP real antes de usarlo; el flujo /ticket no funcionará hasta hacerlo.
Los comandos slash carecen del campo name en el frontmatter. Los 6 comandos tienen description y allowed-tools pero ninguno declara name. La issue #20, una auditoría automática de NLPM, lo clasificó como 8 bugs que «impiden el registro» de los comandos (el repositorio puntuó 81/100).
skill-rules.json sugiere skills que no existen. El archivo de reglas lista 19 skills, pero en el repositorio solo hay 6 directorios de skill reales. Solución: recortar skill-rules.json a las skills que de hecho existen en tu proyecto.
La protección de rama está hardcodeada a main. Si la rama por defecto de tu proyecto es otra (p. ej. master), el bloqueo no se aplica.
No hay licencia. El campo license de la API es None. Ver/clonar es posible, pero la redistribución no está amparada por una licencia explícita.
Preguntas abiertas de aplicabilidad (issues #6 y #1, sin respuesta del autor): si Claude vía suscripción de VS Code Copilot honra estas instrucciones, y cómo adaptar el enfoque a Gemini CLI.

Integraciones y migración

El proyecto consume MCP como capa de integración con JIRA, GitHub, Linear, Sentry, Postgres, Slack, Notion y Memory (completando .mcp.json con servidores reales y exportando las variables de entorno correspondientes). Los cuatro workflows de CI dependen de anthropics/claude-code-action@beta; para migrarlos, copia los .yml y define el secret ANTHROPIC_API_KEY (el README estima un coste mensual de ~$10–$50 según volumen de PRs). Se conecta a TypeScript, Python (Pyright) y Rust (rust-analyzer) vía plugins LSP para inteligencia en tiempo real. No hay guía de migración documentada desde otras plantillas; el único ejemplo de portar el enfoque a otro agente es joeangel/gemini-showcase (Gemini CLI).

Métricas actuales

Medición: 11 de septiembre de 2026, API de GitHub.

Métrica	Valor
Estrellas	6 062
Bifurcaciones	574
Suscriptores (reales)	47
Commits	4
Incidencias abiertas según la API	12
Lenguajes principales	JavaScript (10 789 bytes), Shell (902)
Licencia	Ninguna
Creación	6 de enero de 2026
Último push	6 de enero de 2026
Última publicación / release	Ninguna (sin releases ni tags)

El único contribuidor registrado es ChrisWiles (4 contribuciones). Los 4 commits se publicaron todos el 6 de enero de 2026. El campo watchers_count de la API general devuelve 6 062, igual que las estrellas, por lo que se reporta por separado subscribers_count (47) como suscriptores reales. open_issues_count (12) puede incluir PRs abiertas; de los 19 elementos recuperados (state=all), 6 son incidencias no-PR y 13 son PRs, de las cuales 12 quedan abiertas. No hay releases ni tags, así que el estado del código es el del último commit del 6 de enero de 2026.

Recepción de la comunidad

La recepción se concentra en el repositorio mismo (issues) y en el hilo de Hacker News de origen. No se encontró un lanzamiento dedicado en Product Hunt ni hilos específicos en Reddit.

Entusiasmo y adopción:

El hilo de origen 46515696 acumuló 879 puntos y 123 comentarios; el comentario de OldGreenYodaGPT (id 46516157) enlaza al repositorio y afirma que «un montón de trabajo de mantenimiento y calidad está simplemente… automatizado. Corre ridículamente bien».
Issue #1 (nvictor, 7 de enero de 2026): agradece el recurso y pregunta cómo adaptarlo a Gemini CLI. joeangel respondió construyendo joeangel/gemini-showcase.
Issue #15 (ithiria894, 23 de marzo de 2026): el proyecto fue incluido en awesome-claude-code-workflows porque «demonstraba patrones de workflow reales y funcionales».
Issue #13 (tupe12334, 19 de marzo de 2026, cerrada): «This showcase is an excellent Claude Code configuration reference that many developers use as a starting point».

Crítica y objeciones concretas:

Issue #20 (xiaolai, 22 de abril de 2026): auditoría automática de NLPM que puntuó el repositorio 81/100 y detectó 8 bugs (los 6 comandos sin name en el frontmatter) y hallazgos de seguridad: los 8 servidores MCP usan npx -y sin fijar versión (un paquete comprometido sería adoptado en silencio) y @anthropic/mcp-postgres concede lectura/escritura completa sin acotar permisos.
Issue #12 (Jackie-shi, 26 de febrero de 2026): un pitch de un mercado de skills pidiendo listar el contenido como packs instalables — no es crítica técnica, pero muestra que el repositorio atrae propuestas comerciales de terceros.
Issue #6 (probonopd, 9 de enero de 2026, sin respuesta): pregunta si Claude vía suscripción de VS Code Copilot honra estas instrucciones, y si puede aplicarse a toda una organización de GitHub o solo repo a repo.

Comparación con proyectos similares

Proyecto	Coincidencia verificable	Diferencia verificable
`obra/superpowers`	Ambos enseñan a Claude Code mediante skills y procesos repetibles.	Superpowers es un plugin/marketplace con metodología instalable en varios agentes; el showcase es un ejemplo de configuración de proyecto centrado en React/TypeScript, sin instalación ni licencia.
`joeangel/gemini-showcase` (6 ⭐)	Mismas piezas (hooks, skills, agentes, comandos, GitHub Actions).	Es un puerto al Gemini CLI nacido de la issue #1; el showcase es específico de Claude Code.
`VoltAgent/awesome-claude-code-subagents` (25 001 ⭐)	Colección de subagentes para Claude Code.	Es una lista de 100+ subagentes especializados, no una estructura de proyecto configurable.
`rohitg00/awesome-claude-code-toolkit` (2 608 ⭐)	«Toolkit» de agentes y skills.	Aporta 135 agentes y 35 skills curados; el showcase aporta una configuración de proyecto completa.
`hesreallyhim/awesome-claude-code` (53 872 ⭐)	Recurso curado de Claude Code.	Es un catálogo de recursos; el showcase es una implementación concreta de configuración.

La comparación más útil no es por popularidad: el showcase destaca cuando se quiere una estructura de proyecto React/TypeScript ya cableada para Claude Code. Cuando se busca una metodología transversal portable entre agentes, obra/superpowers es más apropiado; cuando se busca una biblioteca de subagentes, las colecciones awesome-* cubren ese hueco.

Cómo contribuir

El repositorio no documenta un proceso formal de contribución: no hay CONTRIBUTING.md, no hay wiki con guía de contribución y has_discussions es false. El flujo observado a partir de los datos reales (13 PRs recibidos, 6 incidencias) es el estándar de GitHub: bifurcar, crear rama, abrir un PR. Dos matizajes importantes: no hay licencia, por lo que la contribución a un repositorio sin licencia es jurídicamente ambigua, y el repo es una plantilla de un solo autor que no se actualiza desde enero de 2026, así que la ventana de que un PR sea revisado y fusionado es incierta.

Casos de uso

Equipos React/TypeScript/Node que quieren «configurar Claude Code una vez» pueden clonar la estructura y adaptarla a su stack, de modo que el agente genere código que ya respete sus convenciones sin repetir instrucciones en cada sesión.
Responsables de calidad de código con PRs recurrentes pueden activar pr-claude-code-review.yml para que cada PR pase por una revisión automatizada con feedback agrupado por severidad.
Equipos con deuda de mantenimiento pueden encadenar los tres workflows programados (docs-sync mensual, quality semanal, dependency-audit quincenal), con un coste estimado de ~$10–$50/mes.
Equipos que trabajan con tickets (JIRA/Linear) pueden usar /ticket + servidores MCP, tras sustituir los servidores de ejemplo por servidores reales.
Ingenieros de DevOps/CI encuentran una referencia concreta de cómo usar anthropics/claude-code-action@beta con límites de --max-turns y presupuestos de coste.
Quien mantiene instrucciones internas para agentes puede partir de skill-rules.json como modelo de activación determinista de conocimiento de dominio.

Recursos

Repositorio: https://github.com/ChrisWiles/claude-code-showcase
Quick Start: https://github.com/ChrisWiles/claude-code-showcase#quick-start
Skills oficiales: https://github.com/ChrisWiles/claude-code-showcase/tree/main/.claude/skills
Configuración de hooks: https://github.com/ChrisWiles/claude-code-showcase/blob/main/.claude/settings.json
Workflows de GitHub Actions: https://github.com/ChrisWiles/claude-code-showcase/tree/main/.github/workflows
Puerto a Gemini CLI: https://github.com/joeangel/gemini-showcase
Lista curada que lo incluye: https://github.com/ithiria894/awesome-claude-code-workflows
GitHub Action dependiente: https://github.com/anthropics/claude-code-action
Comentario de origen en Hacker News: https://news.ycombinator.com/item?id=46516157
Issues notables: #20 · #1 · #6 · #13 · #15

Nota: este informe combina el README y los archivos del repositorio, la API de GitHub, el hilo de Hacker News de origen y las issues públicas de ChrisWiles/claude-code-showcase, consultados el 11 de septiembre de 2026. Las cifras cambian con el tiempo. La atribución del comentario de HN a Christopher Wiles es inferida por la coincidencia literal de texto, el enlace exacto y la fecha idéntica; no hay una declaración explícita del autor vinculando los handles OldGreenYodaGPT y ChrisWiles.