La mejor forma de aprender es construyendo algo real. Aquí tienes tres proyectos completos, de principio a fin, con los prompts exactos en orden. Solo necesitas Claude Code instalado y ganas.
Cómo seguir un proyecto: abre una terminal, crea una carpeta para el proyecto, entra en ella y ejecuta claude. Luego ve copiando los prompts en orden. Tómate tu tiempo para leer lo que Claude te explica en cada paso.
Qué construirás: una página web personal con tu nombre, foto, biografía y enlaces, lista para enseñar al mundo.
Qué aprenderás: qué son HTML y CSS, cómo se ve un proyecto web por dentro y cómo publicarlo gratis en internet.
1
Crea la base de la web
Pídele a Claude que monte la estructura inicial:
💬Escribe esto a Claude Code
Soy principiante total. Crea una página web personal sencilla con HTML y CSS en esta carpeta. Que tenga: mi nombre como título grande, un hueco para una foto, un párrafo de biografía y una fila de enlaces (LinkedIn, GitHub, email). Que se vea moderna, con colores agradables, y que funcione bien en el móvil. Explícame qué archivos creas y para qué sirve cada uno.
2
Ábrela en el navegador
Mira el resultado por primera vez:
💬Escribe esto a Claude Code
Dime exactamente cómo abrir esta web en mi navegador para verla.
3
Personalízala a tu gusto
Ahora hazla tuya:
💬Escribe esto a Claude Code
Cambia el texto por mi información real: me llamo [tu nombre], soy [a qué te dedicas], y mi biografía es: [escribe 2 frases]. Pon los enlaces a mis redes: [pega tus enlaces]. Cambia los colores a tonos [azules / verdes / lo que quieras].
4
Añade un detalle bonito
Aprende pidiendo mejoras visuales:
💬Escribe esto a Claude Code
Añade una animación suave para que los elementos aparezcan al cargar la página, y que los enlaces cambien de color cuando paso el ratón por encima. Explícame por encima cómo lo has hecho.
5
Publícala gratis en internet
Comparte tu web con el mundo:
💬Escribe esto a Claude Code
Quiero publicar esta web gratis en internet para tener un enlace que pueda compartir. Recomiéndame la forma más fácil para un principiante y guíame paso a paso.
✅ Proyecto 2: App de lista de tareas
Qué construirás: una app donde añadir tareas, marcarlas como hechas y borrarlas, que recuerda tus tareas aunque cierres la página.
Qué aprenderás: qué es JavaScript, cómo una web "reacciona" a lo que haces y cómo se guardan datos en el navegador.
1
Crea la app básica
💬Escribe esto a Claude Code
Soy principiante. Crea una aplicación de lista de tareas que funcione en el navegador, usando solo HTML, CSS y JavaScript (sin librerías externas). De momento quiero poder: escribir una tarea en una caja de texto, pulsar un botón "Añadir" y que aparezca en una lista debajo. Que se vea limpia y moderna. Explícame para qué sirve cada archivo.
2
Marcar tareas como completadas
💬Escribe esto a Claude Code
Ahora quiero poder marcar una tarea como completada al hacer clic en ella: que se ponga tachada y en gris. Y que pueda desmarcarla volviendo a hacer clic.
3
Borrar tareas
💬Escribe esto a Claude Code
Añade un botón de papelera al lado de cada tarea para poder borrarla. Pídeme confirmación antes de borrar.
4
Que recuerde las tareas
El momento "magia": persistencia de datos.
💬Escribe esto a Claude Code
Haz que las tareas se guarden, de forma que si cierro la página y vuelvo a abrirla, mis tareas sigan ahí. Explícame de forma sencilla cómo lo consigues (qué es "localStorage").
5
Pulir y entender
💬Escribe esto a Claude Code
La app ya funciona. Repásala conmigo: explícame en lenguaje sencillo qué hace cada parte del JavaScript, como si me estuvieras enseñando. Y dime una mejora que podría intentar yo solo como ejercicio.
🐍 Proyecto 3: Un script útil en Python
Qué construirás: un programa que organiza automáticamente una carpeta desordenada (como Descargas) metiendo cada archivo en su sitio.
Qué aprenderás: qué es Python, cómo un programa trabaja con tus archivos y cómo probar algo de forma segura antes de aplicarlo de verdad.
1
Comprueba que tienes Python
💬Escribe esto a Claude Code
Comprueba si tengo Python instalado en mi ordenador (uso macOS). Si no lo tengo, guíame para instalarlo. Cuando esté, dime cómo verificar que funciona.
2
Crea el script en modo seguro
Pide que primero solo simule, sin mover nada:
💬Escribe esto a Claude Code
Crea un script en Python que organice los archivos de una carpeta en subcarpetas según su tipo (Imágenes, Documentos, Vídeos, Comprimidos, Otros). MUY IMPORTANTE: de momento que solo MUESTRE qué movería, sin mover nada de verdad. Así puedo revisarlo antes. Explícame cómo ejecutarlo.
3
Pruébalo con una carpeta de ejemplo
💬Escribe esto a Claude Code
Crea una carpeta de prueba con varios archivos falsos de distintos tipos y ejecuta el script sobre ella para ver qué haría. Enséñame el resultado.
4
Actívalo de verdad
💬Escribe esto a Claude Code
Perfecto, funciona como esperaba. Ahora añade una opción para que mueva los archivos de verdad, pero que me pida confirmación antes de empezar y que me diga cuántos archivos movió al terminar.
5
Hazlo reutilizable
💬Escribe esto a Claude Code
Haz que el script me pregunte qué carpeta quiero organizar al ejecutarlo, en vez de tenerlo escrito fijo. Y crea un archivo README.md que explique cómo usarlo, por si lo retomo dentro de meses.
¿Y ahora qué? Cuando termines estos proyectos, intenta uno tuyo desde cero. Describe a Claude Code qué quieres construir y pídele que te guíe paso a paso, igual que aquí. Echa un vistazo a las recetas prácticas para más ideas.