Claude CodeMódulos
Módulo 0430 minIntermedio

Claude Code

El agente de código más poderoso del mundo — sin necesidad de programar

👨‍💻

¿Qué hace diferente a Claude Code?

La diferencia entre Claude Chat y Claude Code es como la diferencia entre un arquitecto que te dibuja los planos y un arquitecto que también construye la casa. Chat te dice cómo hacer las cosas. Code las hace. Puede abrir archivos, ejecutar programas, crear páginas web completas y desplegarlas en Internet — todo desde una conversación en lenguaje natural.

Instalación: dos formas de usarlo

En VS Code / Antigravity (recomendado)

  • Interfaz visual cómoda
  • Ves los archivos en el sidebar izquierdo
  • Claude a la derecha en panel dedicado
  • Ideal para principiantes
  • Antigravity = VS Code + IA integrada

En el Terminal (avanzado)

  • Máximo control y velocidad
  • Ideal para desarrolladores
  • Instalar: npm install -g @anthropic-ai/claude-code
  • Lanzar: cd tu-proyecto && claude
  • Mismo Claude, distinta interfaz

El archivo CLAUDE.md: el cerebro de tu agente

🧠

El CLAUDE.md como system prompt permanente

Cuando hablas con Claude Code, hay un archivo oculto que se adjunta a CADA mensaje que envías. Es como si antes de cada pregunta, Claude leyera en secreto unas instrucciones base. Ese archivo es CLAUDE.md — y tú decides qué hay en él.

markdown
# Mi Agente Personal

## Rol
Eres mi asistente de desarrollo web. Tu especialidad es crear 
landing pages modernas con React y Tailwind.

## Mis preferencias
- Código siempre en TypeScript, nunca JavaScript puro
- Comentarios en español
- Tests unitarios con Vitest
- Deploy en Vercel

## Contexto del proyecto
Trabajo en startups de SaaS. Mi stack principal es:
Next.js 15, Tailwind v4, Supabase, Stripe.

## Reglas importantes
- Mantén este archivo en menos de 200 líneas
- Siempre explica brevemente qué cambios has hecho y por qué

Regla de oro del CLAUDE.md

Manténlo corto y específico. Cada línea del CLAUDE.md se envía con CADA mensaje y consume tokens. Un CLAUDE.md de 500 líneas te agota el contexto rápidamente. Lo ideal: menos de 150-200 líneas, solo lo esencial.

Los 4 modos de Claude Code

ModoQué haceCuándo usarlo
📋 PlanSolo piensa y planifica, NO ejecuta cambiosCuando quieres entender qué va a hacer antes de hacerlo
✏️ Auto-editEdita el archivo seleccionado automáticamentePara cambios rápidos en un archivo concreto
❓ Ask firstPregunta antes de cada cambioCuando quieres supervisar cada paso
⚡ BypassEjecuta sin preguntar nadaProyectos aislados donde confías en Claude totalmente

Cuidado con Bypass

El modo Bypass permite a Claude ejecutar cualquier acción sin confirmación, incluyendo borrar archivos. Úsalo SOLO en proyectos aislados donde no haya datos importantes que perder. Para habilitarlo, usa el flag CLI: 'claude --dangerously-skip-permissions'.

El Loop: por qué Claude Code es un AGENTE

🔄

La diferencia entre chatbot y agente

Un chatbot contesta. Un agente actúa. El loop de Claude Code es: 1) Entiende el objetivo. 2) Actúa. 3) Verifica el resultado. 4) Corrige si hay errores. 5) Repite hasta lograrlo. Este ciclo se repite autónomamente — sin que tú intervengas en cada paso.

Slash Commands esenciales

ComandoQué hace
/initAnaliza la carpeta y entiende la estructura del proyecto
/planActiva el modo planificación (no ejecuta cambios)
/compactComprime el historial de conversación para liberar contexto
/clearLimpia toda la conversación (nueva sesión)
/costMuestra cuántos tokens has usado en la sesión
/memoryAccede y modifica la memoria del agente

Proyecto en vivo: crea y despliega una web

bash
# 1. Crea una carpeta para tu proyecto
mkdir mi-landing && cd mi-landing

# 2. Lanza Claude Code
claude

# 3. Dile qué quieres (en lenguaje natural):
# "Crea una landing page profesional para una clínica dental.
#  Incluye: hero, servicios, testimonios y formulario de contacto.
#  Diseño moderno con colores azul y blanco. Despliégala en Vercel."

# Claude Code hará TODO el resto: 
# - Genera el código HTML/CSS/JS (o React si quieres)
# - Lo prueba en local
# - Lo conecta a Vercel via MCP
# - Te da la URL pública

Context Management (gestión del contexto)

Cada sesión de Claude Code tiene una ventana de contexto. Cuando se llena al 70-80%, Claude te avisa. Usa /compact para comprimir el historial sin perder lo esencial. Usar /clear reinicia todo — úsalo solo cuando empieces una tarea completamente diferente.

✦ Quiz

Llevas 1 hora trabajando con Claude Code y notas que está 'olvidando' instrucciones del principio de la sesión. ¿Qué haces?