Claude Code
101.
3 meses de recorrido.
Todo lo que he aprendido usando Claude Code a diario. De lo más básico a las cosas más avanzadas. Actualizado y sin filtro.
Quince bloques.
Todo lo que necesitas.
Las versiones cambian cada semana, pero la lógica de fondo lleva un año estable y va a seguir.
Tres sabores.
Uno lo cambia todo.
Claude es una IA hecha por Anthropic. Compite con ChatGPT y Gemini. Pero no es una sola cosa: viene en tres versiones, cada una para algo distinto.
Claude.ai
El chat
Le hablas, te responde. Inteligente, rápido, útil. Pero encerrado en una pestaña del navegador. No puede tocar nada fuera.
La API
Para programadores
Para meter Claude dentro de tu producto. Si eres empresa y quieres integrarlo. A ti hoy no te importa.
Claude Code
Claude con manos
La misma IA, pero le abres la puerta de tu ordenador. Lee archivos, crea nuevos, edita, conecta con bases de datos, manda emails, publica páginas en internet. Tú le dices qué quieres. Claude lo hace.
Este es el que lo cambia todo. Sigue leyendo.
técnico.
Todo lo que vas a ver en esta página no requiere conocimientos técnicos. Solo curiosidad e ímpetu. Si sabes lo que quieres, ya tienes lo que hace falta.
"Esto es para programadores"
Es para cualquiera que sepa describir lo que quiere.
"Necesitas saber de servidores"
Claude gestiona servidores, bases de datos y deploys por ti.
"Sin equipo técnico no puedes"
Claude es el equipo técnico. Tú eres la dirección.
La única habilidad que necesitas:
saber describir lo que quieres.
Si le sabes describir a un ser humano cómo se hace un trabajo, se lo sabes describir a Claude. Y si se lo sabes describir a Claude, Claude lo hace.
El cuello de botella ya no es la técnica. Es la claridad de pensamiento.
Marketing & Contenido
- Carruseles de Instagram en 30 min
- Editar podcasts quitando muletillas
- Newsletter semanal en tu tono de marca
Ventas & Operaciones
- 200 emails personalizados a leads
- Procesar 100 facturas PDF a Excel
- CRM propio que sustituye a HubSpot
Producto & Web
- Web entera publicada sin código
- Segundo cerebro con tus notas
- Asistente de agenda y prioridades
Si lo puedes describir con palabras, Claude Code lo puede hacer.
Tres cuentas.
Ya está.
Todo lo que necesitas para empezar son tres cuentas gratuitas. Claude se conecta a las tres y las gestiona por ti.
GitHub
github.comDonde vive tu código. Cada cambio queda guardado con su fecha y se puede deshacer.
Vercel
vercel.comPublica tu web. Cada vez que guardas cambios en GitHub, Vercel actualiza la web automáticamente.
Supabase
supabase.comTu base de datos. Donde viven los usuarios, los formularios, los pedidos. Todo lo que se guarda.
Las tres son gratis.
Los planes gratuitos de GitHub, Vercel y Supabase son más que suficientes para empezar y para la mayoría de proyectos. No necesitas pagar nada.
La estructura del proyecto
Claude la crea automáticamente, pero conviene saber cómo se organiza un proyecto.
Hay cosas que no se suben.
Las claves de Supabase, los tokens de Vercel, las contraseñas... nada de eso debe publicarse en GitHub. El archivo .gitignore le dice a Git qué archivos ignorar.
Crea un .gitignore que excluya .env, tokens,
node_modules y archivos privados.
Dile esto a Claude y lo configura en 5 segundos. No se te vuelve a olvidar.
Usa el mismo email para las tres. Así Claude las conecta solas.
Cinco pasos.
Cinco minutos.
Anthropic sacó un instalador nativo. Ya no hay que instalar Node.js, npm ni configurar variables de entorno. Una sola línea.
Cuenta Claude
Vas a claude.ai y te creas una cuenta con tu Google. Usa el mismo email para todo: Claude, GitHub, Supabase, Vercel.
Un email para todo te ahorra dolores de cabeza increíbles.
Plan Pro (20$/mes)
Claude Code no funciona con el plan gratis. El plan Pro da acceso a todo. Si te quedas corto, subes a Max (100$) más adelante.
Empieza con Pro. Sube solo si te quedas corto.
Instalar Claude Code
Abres tu terminal y pegas un solo comando. Se instala solo. Sin dependencias. Se actualiza automáticamente.
curl -fsSL https://claude.ai/install.sh | bashirm https://claude.ai/install.ps1 | iexPrimera ejecución
Cierras y abres la terminal. Escribes claude y das a Enter. La primera vez se abre tu navegador para autorizarte. Listo.
Escribe claude doctor para comprobar que todo está bien.
Carpeta del proyecto
Crea una carpeta directamente en tu carpeta de usuario (Home), sin espacios ni acentos. Navega ahí con cd y escribe claude. Ya estás dentro.
Si tienes Mac, NO la pongas en Documentos ni Escritorio. Lee el aviso de abajo.
No pongas tu carpeta de Claude dentro de iCloud Drive
Si tienes iCloud Drive activado en macOS, tus carpetas Documentos y Escritorio se sincronizan con la nube. Eso significa que iCloud puede sacar archivos del disco local cuando le parezca, dejando solo el placeholder. Resultado: VS Code y Claude empiezan a fallar porque no encuentran archivos que técnicamente existen pero no están descargados.
Solución: pon la carpeta directamente en tu Home (por ejemplo ~/Claude o ~/dev). Esa ruta NO sincroniza con iCloud y todo queda en local. Aviso a navegantes: si ya tienes algo roto y la carpeta está en Documentos o Escritorio, muévela primero al Home y reabre VS Code.
Lo que pagas y lo que no
¿No te gusta escribir? Háblale.
Usa Handy para hablarle a Claude por voz. Le dictas lo que quieres y Claude lo ejecuta. Como hablar con un asistente que realmente te escucha.
El seguro
de vida.
Antes de ejecutar nada, Claude te enseña el plan completo y espera tu aprobación. El equivalente a pedirle al becario que te explique lo que va a hacer antes de hacerlo.
Plan Mode siempre que el cambio sea grande o cuando la instrucción sea vaga. Religiosamente.
La memoria.
El concepto más importante.
Claude no tiene memoria entre conversaciones. Cada vez que lo abres, empieza de cero. CLAUDE.md es la solución: un archivo que Claude lee automáticamente al arrancar.
Sin CLAUDE.md
Tendrías que explicarle TODO desde cero cada mañana. Las reglas, los colores de marca, el tono de voz, qué carpetas no se tocan. Te volverías loco a la semana.
Empieza con el de Karpathy.
El CLAUDE.md más famoso del mundo. Cuatro reglas que cambian cómo trabaja Claude: piensa antes de escribir, simplicidad, cambios quirúrgicos, y verificación.
Ver en GitHubO copia este prompt.
Pégalo en Claude Code y en 30 segundos tienes tu CLAUDE.md con todo: stack, reglas, y las primeras instrucciones operativas basadas en la estructura de Karpathy.
Lee mi proyecto entero. Analiza estructura, stack y convenciones.
Genera un CLAUDE.md con la estructura de Karpathy y estas reglas:
---
- Stack técnico y estructura de carpetas
- Reglas innegociables (archivos protegidos, colores de marca)
- Deploya siempre via Vercel + GitHub + Supabase
- Nunca me pidas ejecutar comandos, SQL ni nada manual. Hazlo tú.
- Si algo falla, para y dame análisis antes del siguiente intento
- Comunica siempre en español
---
En español. Formato limpio.
Claude analiza tu código y genera el archivo con todas estas reglas incluidas. Luego lo editas tú.
Qué archivo hace qué.
Claude usa varios archivos para recordar cosas. Hay dos niveles: los globales (aplican a todo) y los de proyecto (solo aplican ahí).
Cada vez que corrijas algo a Claude, mételo en el CLAUDE.md.
Recetas
automáticas.
Le enseñas a Claude cómo hacer una tarea concreta, la guardas, y a partir de ese momento la aplica sola cada vez que detecta que toca.
Busca una skill en GitHub (abajo tienes los mejores repos).
Descarga el archivo SKILL.md y ponlo en .claude/skills/nombre/
Claude la detecta automáticamente. La próxima vez que toque, la aplica sola.
Dónde encontrar skills.
Repos públicos de GitHub con cientos de skills listas para instalar.
Anthropic Official
Skills oficiales de Anthropic. Incluye skill-creator, PDF, DOCX, PPTX y más.
Karpathy Guidelines
Las 4 reglas de Karpathy: piensa antes, simplicidad, cambios quirúrgicos, verificación.
ECC (Everything Claude Code)
183 skills + 48 agentes. La colección más grande de skills para Claude Code.
Emil Kowalski
Skills de diseño y animación del creador de animations.dev.
Ejemplos de skills útiles.
Agrupadas por función. Se activan solas según el contexto.
Fuente: Emil Kowalski + Anthropic
Pulido UI al estilo Emil Kowalski. Líneas, proporciones, detalles invisibles.
Animaciones web: easing, timing, transiciones. Curso de Emil.
Espaciado y contraste impecables. Anti-slop.
Fuente: Anthropic + ECC
Crea skills nuevas automáticamente. Le dices qué quieres y la monta.
Genera documentos profesionales en cualquier formato.
Revisa tu código buscando errores y mejoras.
Fuente: Karpathy + ECC
Las 4 reglas: simplicidad, cambios quirúrgicos, verificación.
Prohibe placeholders. Codigo completo siempre.
Audita tu contexto y recupera tokens desperdiciados.
O crea las tuyas.
Le dices a Claude que haga algo, lo afinas hasta que sale perfecto, y le dices: “guarda este flujo como una skill”. A partir de ese momento lo aplica sola.
Guarda lo que acabamos de hacer como una skill.También hay una skill oficial llamada skill-creator que las genera automáticamente.
El valor no esta en saber programar. Esta en saber describir tus procesos.
Los enchufes
con el mundo exterior.
Un MCP es un enchufe que conecta Claude con una herramienta de fuera. Sin MCPs, Claude solo ve la carpeta del proyecto. Con ellos, rompe la pared.
claude mcp add gmailIntegraciones avanzadas
Apps que se conectan como plugins con multiples skills cada una.
Figma
8 skillsCrear archivos, generar diseños, diagramas, librerias, slides.
Slack
6 skillsBuscar mensajes, enviar, resumir canales, borradores.
Notion
8 skillsBuscar, crear páginas, bases de datos, tareas.
¿Cuál instalar primero?
El MCP más rentable es el de la herramienta donde más tiempo pierdes copiando y pegando.
Cuando algo tiene
que pasar sí o sí.
Un hook es una orden que dice: “cuando pase X, ejecuta Y automáticamente”. Sin preguntar. Sin que Claude decida. El 100% de las veces.
CLAUDE.md
Asesor
Claude lo lee, intenta seguirlo, pero es una IA y a veces se le va. Es una guía. Un consejo.
Hook
Reacciona
Se ejecuta el 100% de las veces cuando pasa un evento. Claude edita un archivo, el hook salta. Es una ley.
Cron
Programa
Se ejecuta a una hora fija que tú decides. Cada lunes, cada hora, cada día a las 9. No espera eventos. Él programa.
El hook reacciona. El cron programa.
El hook se dispara cuando pasa algo (“Claude editó un archivo”). El cron se dispara a una hora fija (“cada lunes a las 9”). Uno vigila eventos. El otro sigue un calendario. Los dos son deterministas: se ejecutan sin que Claude pueda decidir no hacerlo.
Hooks
Crons
Prompts para copiar y pegar
Pega cualquiera de estos en Claude Code y funciona directamente.
Crea un hook que formatee el código automáticamente cada vez que edites un archivo.Crea un hook que me pida confirmación antes de borrar cualquier archivo.Crea un hook que bloquee cualquier cambio en la carpeta src/auth/.Crea un hook que ejecute los tests después de cada commit.Crea un hook que actualice los snapshots de test cuando cambie un componente.Crea un cron que cada lunes a las 9h revise los PRs abiertos y me dé un resumen.Crea un cron que cada día a las 8h compruebe que mi web está online.Crea un cron que cada viernes genere un informe semanal del proyecto.Crea un cron que cada hora sincronice los datos del dashboard.Crea un cron que el primer día de cada mes haga backup de la base de datos.Cuando algo te haya fallado 3 veces porque Claude se olvidó,conviértelo en un hook.
Siete apps.
Un centro de control.
La mayoría de negocios usan más de 7 aplicaciones que no se hablan entre sí. Claude Code las conecta todas en un solo dashboard a través de sus APIs.
Toca una app para ver qué herramientas se conectan
Caso real: una empresa importadora europea
Siete herramientas. Cero conexión entre ellas. Así era el día a día.
¿Qué APIs puedes conectar?
Si usas más de 3 apps para gestionar tu negocio, estás perdiendo horas en copiar y pegar.
Automatizaciones
que trabajan solas.
Claude Code construye automatizaciones que funcionan 24/7 sin que toques nada. Webhooks, crons, servicios en servidor. Como Zapier pero hecho a medida y sin límites.
Alta de socio
Pago recibido
Stock bajo
Lead entrante
¿Por qué no usar Zapier directamente?
¿Cuándo usar cada uno?
Si necesitas algo rápido y simple, 2-3 pasos, y no te importa pagar.
Si necesitas lógica compleja, volumen alto, o no quieres pagar mensualidad.
El 80% de las automatizaciones de una empresa caben en 10 webhooks bien pensados.
Tu centro de
control.
Tu cockpit personal. Claude Code construye dashboards que parecen el HUD de un caza. Finanzas, correo, tareas, hábitos, ejercicio, contactos. Todo en una sola pantalla.
10+ APIs conectadas
Holded, Finnhub, Gmail, Calendar, Notion...
Datos LIVE cada 30 segundos
Un solo HTML, sin frameworks, sin build
PWA: funciona en móvil como app nativa
¿Para quién es esto?
No necesitas ser programador. Necesitas saber qué quieres ver cada mañana al abrir el ordenador.
Input de datos.
Output de decisiones.
Además de conectar APIs, puedes construir portales donde tu equipo o tus clientes introducen datos. Esos datos alimentan dashboards, automatizaciones e informes.
Portal de socios: pagan cuota, se registran a eventos
Dashboard del equipo: ven inscripciones en tiempo real
Automatización: email de confirmación + certificado PDF
Informe: asistencia exportable para la junta
Los datos que ya tienes en Excel son oro. Solo necesitan un sitio donde vivir y alguien que los lea.
Lo que nadie
te cuenta.
Claude Code tiene capacidades que no aparecen en ningún tutorial. Estas son las que marcan la diferencia.
Las seis reglas
que no caducan.
Las costumbres que separan a alguien que usa Claude Code de alguien que lo domina. Las versiones cambian. Estas reglas no.
Una tarea por mensaje
No le pidas diez cosas a la vez. Una. Pruébala. Funciona. Siguiente. Mensajes largos con peticiones encadenadas son la vía rápida al caos.
Commits frecuentes
Cada vez que algo funciona, dile a Claude: "commit". Es tu red de seguridad. Si la siguiente versión la caga, vuelves atrás en un segundo.
Plan Mode en cambios grandes
Shift + Tab. Religiosamente. En proyectos grandes, en código que ya está en producción, cuando la instrucción es vaga.
Revisa antes de seguir
Después de cada paso, comprueba que ha funcionado. No avances con un bug a cuestas. Errores acumulados son dolor exponencial.
CLAUDE.md vivo
Cada vez que Claude se equivoque en algo que tú "deberías haberle dicho", añádelo al CLAUDE.md. En 3 meses vale más que todo el código.
Nunca compartas credenciales
Contraseñas, claves API, datos bancarios, DNI, certificados. Eso lo metes tú directamente. Si Claude te las pide, no se las das.
La diferencia real es saber
describir bien lo que quieres.
Si le sabes describir a un ser humano cómo se hace un trabajo, se lo sabes describir a Claude. Y si se lo sabes describir a Claude, Claude lo hace.
El cuello de botella ya no es la técnica. Es la claridad de pensamiento.
Copia, pega,
ejecuta.
Prompts operativos que funcionan directamente en Claude Code. Abre esta página, copia el que necesites, pégalo en tu terminal.
Haz un QA exhaustivo de la app entera. Revisa: 1. Que todas las páginas cargan sin errores 2. Que los formularios funcionan y validan bien 3. Que la navegación es coherente entre páginas 4. Que no hay textos cortados ni botones rotos 5. Responsive en móvil (375px), tablet (768px) y desktop (1440px) 6. Que los links externos abren en pestaña nueva 7. Que no hay errores en la consola del navegador Haz capturas de cada página en las 3 resoluciones.
Abre la web con Playwright. Haz screenshots de TODAS las páginas en 375px, 768px y 1440px. Dime: - Textos cortados o que se salen - Botones rotos o mal alineados - Imágenes descuadradas - Espaciados inconsistentes - Cualquier cosa que no se vea profesional
Haz una auditoría de seguridad del proyecto: 1. Busca secrets expuestos (API keys, tokens, passwords en código) 2. Revisa SQL injection en todos los endpoints 3. Revisa XSS en inputs y renders dinámicos 4. Verifica que los endpoints tienen autenticación 5. Comprueba que .env no esta en git 6. Revisa dependencias con vulnerabilidades conocidas
Prueba TODOS los formularios de la app: 1. Envia cada formulario con datos correctos 2. Envia con campos vacios (debe validar) 3. Envia con datos malformados (email sin @, teléfono con letras) 4. Verifica que los mensajes de error son claros 5. Verifica que tras enviar, el usuario recibe feedback (toast, redirect, etc.)
Ten esta página siempre abierta. Es tu cheat sheet personal.
Términos
traducidos.
Si en algún momento te pierdes con una palabra, vuelves aquí.
Claude
La IA hecha por Anthropic. Compite con ChatGPT y Gemini. Se accede por web, app, o Claude Code.
Claude Code
La versión de Claude que vive en tu ordenador y puede tocar archivos, ejecutar comandos, conectar con apps. Claude pero con manos.
Anthropic
La empresa que crea Claude. Fundada por ex-OpenAI. Foco en seguridad y comportamiento.
Terminal
La pantalla negra donde escribes comandos al ordenador. En Mac: Terminal. En Windows: PowerShell o CMD. Es donde vive Claude Code.
CLI
Command Line Interface. Otra forma de decir terminal. Si lees "CLI", piensa terminal.
Frontend
La parte visible de una app o web. Lo que ve el usuario: botones, formularios, fotos, colores.
Backend
La parte invisible. La lógica, los cálculos, las decisiones. Lo que pasa cuando le das a "enviar".
Base de datos
Donde se guardan los datos: usuarios, pedidos, formularios, todo lo que persiste.
Hosting
El servidor donde está tu web/app para que la gente pueda acceder desde cualquier navegador.
Deploy
Publicar. Subir tu proyecto a internet para que esté disponible para todo el mundo.
Commit
Guardar una versión del código en GitHub. Tu red de seguridad. Se puede deshacer.
Push
Subir esos cambios guardados a la nube de GitHub. Sincronizar tu trabajo.
CLAUDE.md
Archivo de texto con las reglas y contexto del proyecto. Claude lo lee automáticamente al arrancar. La memoria persistente.
AGENTS.md
Variante del CLAUDE.md para cuando Claude trabaja sin supervisión. Define límites del piloto automático.
Skill
Receta guardada que Claude usa sola cuando detecta que toca. Se guardan en .claude/skills/ y se reutilizan en futuros proyectos.
Plan Mode
Se activa con Shift+Tab. Claude muestra el plan antes de ejecutar. Espera tu OK para continuar.
MCP
Model Context Protocol. Enchufe que conecta Claude con herramientas externas como Gmail, Notion, Slack, Calendar.
Hook
Acción automática que se ejecuta SIEMPRE ante un evento concreto. Determinista, no opcional. Es ley, no consejo.
API
Puente entre dos programas. La forma técnica que tiene una app de hablar con otra.
GitHub
Como Google Drive pero para código. Cada cambio que Claude hace se guarda con su fecha y se puede deshacer. Tu red de seguridad. Si algo sale mal, vuelves atrás.
Vercel
Servicio de hosting. Cada vez que haces push a GitHub, Vercel publica la nueva versión automáticamente.
Supabase
Base de datos en la nube. Donde viven usuarios, pedidos, registros. Alternativa open-source a Firebase.
Next.js
El framework más usado para construir webs con React. Lo que Claude Code usa por defecto para crear proyectos web.
React
Librería para construir interfaces web. La base de muchas herramientas modernas. Creada por Meta.
Tailwind
Sistema de estilos para webs. En vez de escribir CSS, usas clases directamente en el HTML. Rápido y consistente.
Plugin
Bundle que combina skills + hooks + MCPs + subagentes en un solo paquete instalable.
Subagente
Una segunda instancia de Claude que se lanza dentro de otra para tareas paralelas o aisladas. Claude dentro de Claude.
Prompt
Lo que le escribes a Claude. El mensaje, la petición. La instrucción que le das para que haga algo.
Token
La unidad de medida del consumo. Cuanto más larga la conversación, más tokens. Determinan el coste y el límite de uso.
Contexto
La cantidad de información que Claude puede tener "en mente" a la vez. Como la memoria de trabajo. Se mide en tokens.
Apificación
Conectar varias apps (ecommerce, contabilidad, CRM, email...) en un solo dashboard via APIs. Un centro de control unificado.
Agentificación
Automatización server-side que trabaja sola: webhooks, crons, servicios. Como Zapier pero custom, sin límites y sin coste mensual.
Gamificación
Dashboard personal tipo cockpit/HUD. Finanzas, hábitos, calendario, inversiones, todo en una pantalla con datos en tiempo real.
Operaciones
Sistemas de input de datos: formularios, portales de cliente, importación de Excel. Los datos alimentan dashboards y automatizaciones.
Computer Use
Capacidad de Claude de controlar tu ordenador entero: ratón, teclado, screenshots. Abre apps, rellena formularios, navega webs.
Webhook
Una URL que recibe datos automáticamente cuando algo pasa. "Cuando alguien paga, avísame aquí." Es el trigger de las agentificaciones.
Cron
Tarea programada que se ejecuta sola a una hora fija. "Cada lunes a las 9, genera el informe semanal." Automatización temporal.
Service Role Key
Llave maestra de Supabase que puede leer y escribir todo. Solo se usa en el servidor, nunca en el navegador.
PWA
Progressive Web App. Una web que se comporta como app nativa en el móvil. Se instala desde el navegador, funciona offline.
Responsive
Que se adapta a cualquier pantalla: móvil, tablet, escritorio. Si no es responsive, no existe.