← Volver a tutoriales← Back to tutorials

TutorialesTutorials · PrincipianteBeginner

Vibe coding: cómo crear software hablándole a la IAVibe coding: how to build software by talking to AI

Qué es el 'vibe coding', por qué cambió todo para quien no programa, y cómo empezar a construir cosas reales describiéndolas con palabras (sin memorizar código).What 'vibe coding' is, why it changed everything for non-coders, and how to start building real things by describing them in words (no memorizing code).

  • Claude Code
  • VS Code

Vibe coding es construir software describiéndolo con palabras a una IA, en vez de escribir cada línea de código tú. Tú diriges (la visión, las decisiones); la IA teclea. Así se hizo este sitio. Toca cada bloque para abrirlo.

Vibe coding is building software by describing it in words to an AI, instead of typing every line yourself. You direct (the vision, the decisions); the AI types. That’s how this site was built. Tap each block to open it.

¿Qué es exactamente?What is it exactly?

Le dices a la IA qué quieres (“una página con un formulario que me mande un correo”) y ella escribe el código, lo explica y lo ejecuta. Tú revisas, pides cambios y avanzas. No necesitas saber el lenguaje de programación de memoria: necesitas saber pedir y saber decidir.

You tell the AI what you want (“a page with a form that emails me”) and it writes the code, explains it and runs it. You review, ask for changes and move on. You don’t need to know the programming language by heart: you need to know how to ask and how to decide.

Qué necesitas para empezarWhat you need to start
  1. Un editor: VS Code.
  2. Una IA que programe dentro de él: Claude Code (cómo instalarlo).
  3. Un lugar para guardar y publicar: GitHub (guía) + Vercel.

Con eso ya puedes construir y publicar cosas reales.

  1. An editor: VS Code.
  2. An AI that codes inside it: Claude Code (how to install it).
  3. A place to save and publish: GitHub (guide) + Vercel.

With that you can already build and publish real things.

Cómo pedir bien (lo más importante)How to ask well (the most important part)
  • Sé concreta: di qué quieres, para quién y cómo debe verse o comportarse.
  • Un paso a la vez: pide cosas chicas y prueba antes de seguir.
  • Da ejemplos: “como esta página”, “con estos colores”.
  • Pide que te explique: “explícame qué hiciste en palabras simples”.
  • Revisa antes de aceptar: Claude te muestra los cambios; tú apruebas.
  • Be specific: say what you want, for whom and how it should look or behave.
  • One step at a time: ask for small things and test before moving on.
  • Give examples: “like this page”, “with these colors”.
  • Ask it to explain: “explain what you did in simple words”.
  • Review before accepting: Claude shows the changes; you approve.
Reglas para no romper nadaRules to avoid breaking things
  • Guarda seguido con Git (commit + push), así siempre puedes volver atrás.
  • Prueba cada cambio antes de pedir el siguiente.
  • Si algo se rompe, dile a Claude el error tal cual aparece; lo arregla.
  • No subas contraseñas ni llaves secretas a GitHub.
  • Save often with Git (commit + push), so you can always go back.
  • Test each change before asking for the next.
  • If something breaks, tell Claude the exact error message; it’ll fix it.
  • Never push passwords or secret keys to GitHub.
Tu primer reto (10 minutos)Your first challenge (10 minutes)

Abre Claude Code en una carpeta vacía y pídele: “Crea una página web sencilla que diga mi nombre y un botón que muestre un saludo. Explícame cada parte.” Acepta, ábrela y juega. Acabas de hacer vibe coding. 🎉

Siguiente paso: De cero a tu primera página web con Claude Code.

Open Claude Code in an empty folder and ask: “Create a simple web page that shows my name and a button that displays a greeting. Explain each part.” Accept, open it and play. You just did vibe coding. 🎉

Next step: From zero to your first web page with Claude Code.