Guía Claude Code para Danfor Dan

Hola, Dan 👋Hi, Dan 👋

Describe lo que imaginas.
Claude lo construye. Describe what you imagine.
Claude builds it.

No necesitas saber programar para empezar. Necesitas saber lo que quieres y explicarlo bien — en español, en inglés o hablando en voz alta. Esta guía te enseña cómo. You don't need to know how to code to start. You need to know what you want and explain it well — in Spanish, in English, or out loud. This guide shows you how.

Empieza aquíStart here ↓ Ir al creador de promptsJump to the prompt builder

👆 ¿Ves el botón ES / EN arriba? Pruébalo. Al final de esta guía sabrás pedirle a Claude uno igual para tus apps. 👆 See the ES / EN button up top? Try it. By the end of this guide you'll know how to ask Claude for one just like it in your own apps.

~/proyectos/bienvenida — claude
01

¿Qué es Claude Code?What is Claude Code?

Es un compañero de trabajo que vive en tu computadora. Tú le explicas lo que quieres; él escribe el código, crea los archivos, lo prueba y arregla los errores. Tú diriges. It's a coworker that lives on your computer. You explain what you want; it writes the code, creates the files, tests it and fixes mistakes. You're in charge.

💬

Tú hablasYou talk

Escribe (o dicta) como le hablarías a una persona. No hay comandos secretos.Type (or dictate) like you'd talk to a person. There are no secret commands.

🛠️

Él construyeIt builds

Crea y edita archivos reales en una carpeta de tu Mac. Lo que hace, lo puedes ver y abrir.It creates and edits real files in a folder on your Mac. You can see and open everything it makes.

✋

Te pide permisoIt asks permission

Antes de cambiar algo importante, te pregunta. Puedes decir sí, no, o “hazlo diferente”.Before changing anything important, it asks. You can say yes, no, or “do it differently.”

🎓

Te enseñaIt teaches

Pregúntale “¿qué hiciste y por qué?” cuando quieras. Así aprenderás muy rápido.Ask “what did you do and why?” anytime. That's how you'll learn fast.

La idea clave:The key idea: tu trabajo ya no es escribir código. Tu trabajo es pensar con claridad y explicar bien lo que quieres. Como pastor, ¡ya eres bueno en eso! your job is no longer writing code. Your job is to think clearly and explain well what you want. As a pastor, you're already good at that!
02

Instalación en tu MacSetting up on your Mac

Solo se hace una vez. Diez minutos y listo. You only do this once. Ten minutes and you're done.

  1. Abre la TerminalOpen Terminal

    Presiona ⌘ Cmd + Espacio, escribe Terminal y presiona Enter. Es una ventana donde escribes instrucciones en texto. No muerde. 🙂Press ⌘ Cmd + Space, type Terminal and press Enter. It's a window where you type instructions as text. It doesn't bite. 🙂

  2. Instala Claude CodeInstall Claude Code

    Copia esta línea, pégala en la Terminal y presiona Enter:Copy this line, paste it into Terminal and press Enter:

    curl -fsSL https://claude.ai/install.sh | bash

    Necesitas una cuenta de Claude (plan Pro o superior). Si algo sale diferente, revisa la guía oficial de instalación.You'll need a Claude account (Pro plan or higher). If anything looks different, check the official setup guide.

  3. Crea una carpeta para tu proyecto y entraCreate a folder for your project and go into it

    Cada app vive en su propia carpeta. Esto crea una y abre Claude ahí:Each app lives in its own folder. This creates one and starts Claude there:

    mkdir -p ~/proyectos/bienvenida && cd ~/proyectos/bienvenida && claude

    La primera vez te pedirá iniciar sesión en el navegador. Sigue los pasos.The first time, it'll ask you to log in through your browser. Just follow along.

  4. Activa el dictado en español 🎤Turn on Spanish dictation 🎤

    Ve a Ajustes del Sistema → Teclado → Dictado, actívalo y elige Español (puedes agregar inglés también). Luego, en cualquier lugar — incluida la Terminal — presiona la tecla 🌐 / Fn dos veces y habla.Go to System Settings → Keyboard → Dictation, turn it on and choose Spanish (you can add English too). Then anywhere — including Terminal — press the 🌐 / Fn key twice and talk.

    Truco: piensa en voz alta. “Quiero una página para los visitantes nuevos… que tenga los horarios… y un mapa…” Claude entiende aunque no sea perfecto.Tip: think out loud. “I want a page for new visitors… with service times… and a map…” Claude understands even if it isn't perfect.

Teclas que vas a usarKeys you'll use

  • Esc interrumpe a Claude si va por mal caminointerrupts Claude if it's heading the wrong way
  • ↑ repite lo último que escribistebrings back what you last typed
  • Shift+Tab cambia de modo (incluido el modo plan)switches modes (including Plan Mode)
  • Ctrl+C ×2 sale de Claudeexits Claude

¿Prefieres no usar la Terminal?Rather skip the Terminal?

Claude Code también funciona dentro de la app de escritorio de Claude y en editores como VS Code. Todo lo de esta guía aplica igual.Claude Code also works inside the Claude desktop app and in editors like VS Code. Everything in this guide applies the same way.

03

Piensa antes de construirThink before you build

Este es el secreto más importante de toda la guía. Si escribes “hazme una app”, recibirás algo genérico. Si primero piensas en para quién, para qué y qué es lo mínimo, recibirás exactamente lo que imaginas. This is the most important secret in the whole guide. If you type “make me an app,” you'll get something generic. If you first think about who it's for, what it's for and what the bare minimum is, you'll get exactly what you imagine.

👥 ¿Para quién?Who is it for?

Visitantes, voluntarios, jóvenes, el equipo pastoral… Cambia todo.Visitors, volunteers, youth, the pastoral team… It changes everything.

🎯 ¿Qué problema resuelve?What problem does it solve?

Una frase. “La gente no sabe cuándo es el próximo Servicio Hispano.”One sentence. “People don't know when the next Servicio Hispano is.”

📱 ¿Qué pantallas?What screens?

Haz una lista: inicio, detalles, formulario… Un dibujo en papel ayuda muchísimo.Make a list: home, details, a form… A sketch on paper helps a ton.

🗂️ ¿Qué información?What information?

Fechas, nombres, horarios… ¿De dónde viene? ¿Quién la cambia?Dates, names, schedules… Where does it come from? Who changes it?

✂️ Versión 1 vs. despuésVersion 1 vs. later

Empieza pequeño. Lo pequeño que funciona vale más que lo grande a medias.Start small. Something small that works beats something big that's half-done.

🌎 ¿Idioma y dispositivos?Language & devices?

¿Español, inglés o ambos? ¿Teléfono, computadora o los dos?Spanish, English or both? Phone, computer or both?

🧰 Creador de prompts🧰 Prompt builder

Llena las casillas y esta página escribe tu primer mensaje para Claude. Cópialo y pégalo. (Pruébalo con un ejemplo primero.)Fill in the boxes and this page writes your first message to Claude. Copy and paste it. (Try an example first.)

Ejemplos:Examples:
Idioma de la appApp language
DispositivosDevices
Escribir el prompt enWrite the prompt in
Tu promptYour prompt 

              
Fíjate en las dos últimas líneas: le piden a Claude que pregunte primero y te muestre un plan. Esa costumbre te ahorrará horas.Notice the last two lines: they ask Claude to ask questions first and show you a plan. That habit will save you hours.

            

          

        


        

          

            
🗺️ Modo PlanPlan Mode

            
Presiona Shift+Tab hasta que veas plan mode abajo. En este modo Claude no toca ningún archivo: investiga, piensa y te presenta un plan. Tú lo lees, haces preguntas, pides cambios… y cuando estés de acuerdo, lo apruebas y empieza a construir.Press Shift+Tab until you see plan mode at the bottom. In this mode Claude doesn't touch any files: it researches, thinks and gives you a plan. You read it, ask questions, request changes… and when you agree, you approve it and it starts building.

            
Úsalo siempre al empezar algo nuevo o grande.Use it every time you start something new or big.

          

          

            
📌 CLAUDE.md: tus reglas permanentesCLAUDE.md: your standing rules

            
Es un archivo de notas que Claude lee cada vez que abre tu proyecto. Escribe /init para crearlo, o pídele: “agrega esto a CLAUDE.md”. Por ejemplo:It's a notes file Claude reads every time it opens your project. Type /init to create it, or ask: “add this to CLAUDE.md.” For example:


# Sobre mí
- Soy principiante. Explícame tus decisiones en palabras sencillas.
- Háblame siempre en español.

# Sobre este proyecto
- Es para Lompoc Foursquare Church.
- Toda la app en español e inglés, con botón ES/EN.
- Debe funcionar bien en teléfono.


# About me
- I'm a beginner. Explain your decisions in simple words.
- Always talk to me in Spanish.

# About this project
- It's for Lompoc Foursquare Church.
- The whole app in Spanish and English, with an ES/EN button.
- It must work well on phones.

          

        

      

    


    
    

      

        

          04
          
Tu idioma, tus reglasYour language, your rules

          

            Hay tres cosas distintas que conviene no confundir:
            There are three different things worth keeping separate:
          

        


        

          

            
🗣️

            
1. Cómo le hablas a Claude1. How you talk to Claude

            
En español, escrito o dictado. Claude entiende perfectamente — y te responde en español. Puedes mezclar idiomas sin problema.In Spanish, typed or dictated. Claude understands perfectly — and answers in Spanish. You can mix languages, no problem.

          

          

            
🖥️

            
2. En qué idioma está tu app2. What language your app is in

            
El que tú digas. Puedes hablarle en español y pedirle una app en inglés, o al revés. Solo díselo claramente.Whatever you say. You can talk in Spanish and ask for an app in English, or the other way around. Just say so clearly.

          

          

            
🔁

            
3. El botón ES/EN3. The ES/EN button

            
Para una iglesia con Servicio Hispano y servicios en inglés, esto es oro: una sola app que cada persona ve en su idioma.For a church with Servicio Hispano and English services, this is gold: one app that each person sees in their own language.

          

        


        

          

            
⚠️ Pídelo desde el primer día⚠️ Ask for it on day one

            
Agregar el botón de idioma al principio es fácil. Agregarlo cuando la app ya está grande significa buscar cada palabra, en cada pantalla. Si crees que algún día la querrás bilingüe, pídelo en tu primer mensaje:Adding the language button at the start is easy. Adding it once the app is big means hunting down every word, on every screen. If you think you'll ever want it bilingual, ask in your very first message:

            
Hazla bilingüe (español e inglés) con un botón ES/EN visible arriba. Español por defecto. Que recuerde el idioma que eligió cada persona.Make it bilingual (Spanish and English) with a visible ES/EN button at the top. Spanish by default. It should remember the language each person chose.

            
Dato: el código por dentro (nombres de variables, etc.) normalmente está en inglés. Es normal y no importa — tú le hablas a Claude en español y él te explica todo en español.Note: the code itself (variable names, etc.) is usually in English. That's normal and doesn't matter — you talk to Claude in Spanish and it explains everything in Spanish.

          


          
          

            

              
              
            

            

              

              

              

              

              

                
                
              

            

            
↑ Una app de ejemplo. Toca su propio botón ES/EN.↑ A sample app. Tap its own ES/EN button.

          

        

      

    


    
    

      

        

          05
          
Una app web: computadora y teléfonoOne web app: computer and phone

          

            Una app web es una página web que se comporta como una app. La construyes una sola vez y funciona en la computadora, en iPhone y en Android. Sin App Store, sin permisos especiales, y cuando la actualizas, todos ven el cambio al instante.
            A web app is a website that behaves like an app. You build it once and it works on a computer, on iPhone and on Android. No App Store, no special approvals, and when you update it, everyone sees the change instantly.
          

        


        
        
Mismo código. En pantalla grande, tres columnas; en el teléfono, una debajo de otra. A esto se le llama diseño responsivo.Same code. On a big screen, three columns; on a phone, one under the other. This is called responsive design.


        

          

            
↔️

            
Pruébalo ahoraTry it now

            
Si estás en la computadora, haz esta ventana más angosta. Mira cómo esta misma guía se reacomoda como en un teléfono.If you're on a computer, make this window narrower. Watch this very guide rearrange itself like it would on a phone.

          

          

            
📲

            
Agrégala a tu iPhoneAdd it to your iPhone

            
Abre esta guía en Safari → toca Compartir  → Agregar a pantalla de inicio. Ahora tiene su propio ícono y se abre como app. ¡Esta guía ya es una app web!Open this guide in Safari → tap Share  → Add to Home Screen. Now it has its own icon and opens like an app. This guide is already a web app!

          

          

            
🔍

            
Míralo en tu teléfono mientras construyesSee it on your phone while you build

            
Pregúntale a Claude: “¿Cómo abro esto en mi teléfono?” Te dará una dirección para verla en tu Wi-Fi, o te ayudará a publicarla en GitHub (sección 07).Ask Claude: “How do I open this on my phone?” It'll give you an address to view it on your Wi-Fi, or help you publish it on GitHub (section 07).

          

        


        

          
✨ La frase mágica para tus prompts✨ The magic sentence for your prompts

          
Hazla una app web que funcione bien en teléfono y computadora, y que se pueda agregar a la pantalla de inicio del iPhone.Make it a web app that works well on phone and computer, and that can be added to the iPhone home screen.

        


        

          ¿Y las apps “de verdad” de la App Store?What about “real” App Store apps?
          
También se pueden hacer con Claude, pero requieren más pasos (cuenta de desarrollador de Apple, revisión, etc.). Empieza con apps web: son más rápidas, gratis y ya funcionan en cualquier teléfono. Cuando una idea crezca mucho, ese será un buen siguiente paso.You can build those with Claude too, but they take more steps (an Apple developer account, review, etc.). Start with web apps: they're faster, free, and already work on any phone. When an idea really grows, that's a good next step.

        

      

    


    
    

      

        

          06
          
Muéstrale, no solo le digasShow it, don't just tell it

          

            Claude puede ver imágenes y leer archivos. Una foto o una hoja de cálculo explica más que mil palabras — y así consigues que la app quede exactamente como la quieres.
            Claude can see images and read files. A photo or a spreadsheet explains more than a thousand words — and it's how you get the app exactly the way you want it.
          

        


        

          

            
🖼️

            
Imágenes y capturasImages & screenshots

            
Arrastra el archivo a la ventana de la Terminal, o cópialo y pégalo con Ctrl+V. “Haz que se vea como esta captura.”Drag the file into the Terminal window, or copy it and paste with Ctrl+V. “Make it look like this screenshot.”

          

          

            
✏️

            
Un dibujo en papelA sketch on paper

            
Dibuja la pantalla en una servilleta, tómale foto con el iPhone, pásala por AirDrop y arrástrala. “Construye esta pantalla.” ¡Funciona!Draw the screen on a napkin, snap a photo with your iPhone, AirDrop it and drag it in. “Build this screen.” It works!

          

          

            
📊

            
Hojas de cálculoSpreadsheets

            
Guarda el Excel o CSV en la carpeta del proyecto y menciónalo con @: “Usa @voluntarios.csv para crear el horario.”Save the Excel or CSV file in the project folder and mention it with @: “Use @voluntarios.csv to build the schedule.”

          

          

            
🔗

            
Sitios web y PDFsWebsites & PDFs

            
Dale un enlace: “Basa el diseño en lompocfoursquare.com.” O un PDF con el boletín, el menú o las reglas del ministerio.Give it a link: “Base the design on lompocfoursquare.com.” Or a PDF with the bulletin, a menu or ministry guidelines.

          

        


        

          

            
Así se hizo esta páginaHow this page was made

            
¿Notaste los colores, la letra y el logo?Notice the colors, the font and the logo?

            
Nadie los eligió a mano. Se le dio a Claude el sitio de la iglesia y se le dijo que basara el diseño en él. Claude leyó el sitio, encontró los colores exactos (carbón, gris cálido), la letra Poppins y el logo — y los usó aquí.Nobody picked them by hand. Claude was given the church's website and told to base the design on it. Claude read the site, found the exact colors (charcoal, warm gray), the Poppins font and the logo — and used them here.

            
Tú puedes hacer lo mismo con cualquier sitio, gráfico o logo:You can do the same with any website, graphic or logo:

            
Basa los colores, la letra y el estilo en lompocfoursquare.com, y usa el logo que está en @logo.png.Base the colors, font and style on lompocfoursquare.com, and use the logo in @logo.png.

          

          

            Lompoc Foursquare Church logo
            

              #2A2829
              #878787
              #E0E0DC
              #FFFFFF
            

            
Poppins — Aa Bb Cc 123

          

        

      

    


    
    

      

        

          07
          
GitHub = puntos de guardadoGitHub = save points

          

            ¿Has jugado un videojuego donde guardas la partida antes del jefe final? Si pierdes, regresas a ese punto. Git hace eso con tu app, y GitHub guarda esos puntos en la nube. Así nunca tienes miedo de romper algo.
            Ever played a video game where you save before the final boss? If you lose, you go back to that point. Git does that for your app, and GitHub stores those save points in the cloud. So you're never afraid of breaking something.
          

        


        

          
LunesMonday
Página de inicio con horariosHome page with service times

          
MartesTuesday
Botón ES/ENES/EN button

          
MiércolesWednesday
Mapa y fotosMap and photos

          
Jueves 😬Thursday 😬
Algo se rompió…Something broke…

          
↩︎
“Regresa al miércoles”. Listo.“Go back to Wednesday.” Done.

        


        

          

            
Palabras que vas a escucharWords you'll hear

            

              
Repo (repository)
La carpeta de tu proyecto, con memoria de todo su historial.Your project folder, with a memory of its whole history.

              
Commit
Un punto de guardado, con una nota que dice qué cambió.A save point, with a note saying what changed.

              
Push
Subir tus puntos de guardado a GitHub (respaldo en la nube).Upload your save points to GitHub (cloud backup).

              
Branch (rama)
Una copia para probar una idea sin afectar lo que ya funciona.A copy to try an idea without touching what already works.

              
GitHub Pages
Publica tu app en internet gratis, directamente desde GitHub.Publishes your app on the internet for free, straight from GitHub.

            

          

          

            
No memorices comandos. Solo díselo:Don't memorize commands. Just say it:

            
    
              
  • “Guarda un punto de control con un buen mensaje.”“Save a checkpoint with a good message.”
    • 
              
  • “Sube los cambios a GitHub.”“Push the changes to GitHub.”
    • 
              
  • “¿Qué cambió desde ayer?”“What changed since yesterday?”
    • 
              
  • “Algo se rompió. Regresa al último punto que funcionaba.”“Something broke. Go back to the last point that worked.”
    • 
              
  • “Prueba esta idea en una rama aparte.”“Try this idea on a separate branch.”
    • 
              
  • “Publica esto en GitHub Pages.”“Publish this on GitHub Pages.”
    • 
            

            
Primera vez: crea una cuenta gratis en github.com y dile a Claude: “Ayúdame a conectar este proyecto con mi cuenta de GitHub.” Te guiará paso a paso.First time: create a free account at github.com and tell Claude: “Help me connect this project to my GitHub account.” It'll walk you through it.

          

        


        

          🔎 Esta guía vive en GitHub. Puedes ver cada punto de guardado de cómo se construyó en su historial de commits.
          🔎 This guide lives on GitHub. You can see every save point of how it was built in its commit history.
        

      

    


    
    

      

        

          08
          
Cuidado y privacidadCare & privacy

          

            Una iglesia maneja información delicada: pedidos de oración, datos de familias, niños y ofrendas. Unas reglas sencillas te protegen a ti y a tu congregación.
            A church handles sensitive information: prayer requests, family details, kids and giving. A few simple rules protect you and your congregation.
          

        


        
    
          
  • 🙈
    Usa datos inventados mientras construyes.Use made-up data while you build.
    “Juan Pérez, 555-0100”. Nunca la lista real de miembros.“John Smith, 555-0100.” Never the real member list.
    • 
          
  • 🔒
    Público vs. privado en GitHub.Public vs. private on GitHub.
    Un repo público lo puede ver cualquiera. Nada personal ahí. Si dudas, hazlo privado.A public repo can be seen by anyone. Nothing personal goes there. When in doubt, make it private.
    • 
          
  • 🔑
    Nunca contraseñas ni claves en el código.Never passwords or keys in the code.
    Si una app necesita una clave, pregúntale a Claude cómo guardarla de forma segura.If an app needs a key, ask Claude how to store it safely.
    • 
          
  • 🧒
    Niños, oración y ofrendas = cuidado extra.Kids, prayer and giving = extra care.
    Antes de publicar algo así, consulta con el equipo de la iglesia y pregúntale a Claude: “¿Qué riesgos de privacidad tiene esto?”Before publishing anything like that, check with the church team and ask Claude: “What privacy risks does this have?”
    • 
          
  • 👀
    Lee antes de aprobar.Read before you approve.
    Cuando Claude te pida permiso, lee qué va a hacer. Si no entiendes, pregunta: “¿Qué hace esto?”When Claude asks permission, read what it's about to do. If you don't understand, ask: “What does this do?”
    • 
        

      

    


    
    

      

        

          09
          
Tu caminoYour path

          

            Cada proyecto te enseña algo nuevo. Empieza por el primero; vas a crecer más rápido de lo que crees.
            Each project teaches you something new. Start with the first one; you'll grow faster than you think.
          

        


        
    
          
  1. 
            
    Día 1Day 1
    
            
    
              
    Página de bienvenida para visitantesWelcome page for visitors
    
              
    Aprendes: hablar con Claude, ver tu página en el navegador.You learn: talking to Claude, seeing your page in the browser.
    
              
    Crea una página de bienvenida para visitantes nuevos de Lompoc Foursquare Church. Horarios de los domingos: 8:30, 10:00 y 11:30. Dirección: 125 N. C St., Lompoc. Bilingüe con botón ES/EN. Basa el estilo en lompocfoursquare.com.Create a welcome page for new visitors to Lompoc Foursquare Church. Sunday service times: 8:30, 10:00 and 11:30. Address: 125 N. C St., Lompoc. Bilingual with an ES/EN button. Base the style on lompocfoursquare.com.
    
            
    
          
    2. 
          
  2. 
            
    Semana 1Week 1
    
            
    
              
    Horario de voluntarios desde una hoja de cálculoVolunteer schedule from a spreadsheet
    
              
    Aprendes: darle archivos a Claude, búsquedas y filtros.You learn: giving Claude files, search and filters.
    
              
    Usa @voluntarios.csv para crear una página donde cada voluntario busque su nombre y vea cuándo le toca servir. Que funcione bien en el teléfono.Use @voluntarios.csv to build a page where each volunteer searches for their name and sees when they're serving. It should work well on phones.
    
            
    
          
    3. 
          
  3. 
            
    Semanas 2–3Weeks 2–3
    
            
    
              
    App del Servicio HispanoServicio Hispano app
    
              
    Aprendes: apps instalables, compartir, publicar con GitHub Pages.You learn: installable apps, sharing, publishing with GitHub Pages.
    
              
    Crea una app web para el Servicio Hispano: próximas fechas, detalles de cada servicio, botón para invitar a un amigo por WhatsApp y botón ES/EN. Que se pueda agregar a la pantalla de inicio. Luego ayúdame a publicarla en GitHub Pages.Create a web app for Servicio Hispano: upcoming dates, details for each service, a button to invite a friend via WhatsApp, and an ES/EN button. It should be installable to the home screen. Then help me publish it on GitHub Pages.
    
            
    
          
    4. 
          
  4. 
            
    Mes 1+Month 1+
    
            
    
              
    Muro de oración o inscripción a eventosPrayer wall or event sign-ups
    
              
    Aprendes: bases de datos, inicio de sesión, quién puede ver qué.You learn: databases, logins, who can see what.
    
              
    Quiero un muro de oración: los miembros envían pedidos, el equipo pastoral los revisa antes de que se vean, y algunos pueden ser privados. Antes de construir, explícame las opciones para guardar los datos de forma segura y muéstrame un plan.I want a prayer wall: members submit requests, the pastoral team reviews them before they're shown, and some can be private. Before building, explain my options for storing the data safely and show me a plan.
    
            
    
          
    5. 
        


        
Más ideas: plan de lectura bíblica para los jóvenes · boletín semanal imprimible · buscador de grupos pequeños · inscripción para Misiones a México · registro para el bautismo.More ideas: a Bible reading plan tracker for the youth · a printable weekly bulletin · a small-group finder · Mexico Missions sign-ups · water baptism registration.

      

    


    
    

      

        

          10
          
Hoja de referenciaCheat sheet

          

            Guarda esta sección. Vas a volver a ella.
            Bookmark this section. You'll come back to it.
          

        


        

          

            
Frases que funcionanPhrases that work

            
    
              
  • Explícame lo que hiciste, en palabras sencillas.Explain what you did, in simple words.
    • 
              
  • No entiendo. Explícamelo más simple.I don't understand. Explain it more simply.
    • 
              
  • Antes de hacer nada, muéstrame un plan.Before doing anything, show me a plan.
    • 
              
  • Hazme las preguntas que necesites primero.Ask me whatever questions you need first.
    • 
              
  • Ábrelo en el navegador para que lo vea.Open it in the browser so I can see it.
    • 
              
  • Esto no se ve bien en el teléfono. Arréglalo.This doesn't look right on the phone. Fix it.
    • 
              
  • Haz que se parezca a esta imagen: (arrastra la imagen)Make it look like this image: (drag the image in)
    • 
              
  • Hay un error: (pega el mensaje). ¿Qué significa?There's an error: (paste the message). What does it mean?
    • 
              
  • Guarda un punto de control y súbelo a GitHub.Save a checkpoint and push it to GitHub.
    • 
              
  • ¿Qué debería construir después para aprender más?What should I build next to learn more?
    • 
            

          


          

            
Atajos dentro de Claude CodeShortcuts inside Claude Code

            

              
Shift+TabCambiar de modo (modo plan)Switch modes (Plan Mode)

              
EscDetener a ClaudeStop Claude

              
Esc EscVolver a un mensaje anteriorGo back to an earlier message

              
@archivoMencionar un archivoMention a file

              
Ctrl+VPegar una imagenPaste an image

              
/initCrear CLAUDE.mdCreate CLAUDE.md

              
/clearEmpezar una conversación nuevaStart a fresh conversation

              
/helpVer todos los comandosSee all commands

              
🌐 ×2Dictado del MacMac dictation

            

          


          

            
GlosarioGlossary

            

              
Prompt
Lo que le escribes a Claude. Tu pedido.What you write to Claude. Your request.

              
Frontend
Lo que la gente ve y toca: pantallas y botones.What people see and touch: screens and buttons.

              
Backend
Lo que pasa “detrás”: guardar datos, enviar correos.What happens “behind”: saving data, sending emails.

              
HTML / CSS / JavaScript
Los tres idiomas de la web: estructura, diseño y comportamiento.The three languages of the web: structure, style and behavior.

              
Base de datosDatabase
Donde una app guarda información para después.Where an app stores information for later.

              
Deploy
Publicar tu app en internet para que otros la usen.Putting your app on the internet for others to use.

              
Responsive
Que se adapta a pantallas grandes y pequeñas.Adapts to big and small screens.

              
PWA
App web que se instala en la pantalla de inicio.A web app you can install on the home screen.

              
Localhost
Tu app corriendo solo en tu computadora, para probar.Your app running only on your computer, for testing.

              
Bug
Un error. Normal. Claude te ayuda a arreglarlo.A mistake. Normal. Claude helps you fix it.

              
i18n
Abreviatura en inglés de “hacer una app multilingüe”.Shorthand for “making an app multilingual.”

              
Terminal
La ventana donde escribes instrucciones de texto.The window where you type text instructions.

            

          

        

      

    


    
    

      

        
        
¿Qué vas a construir primero?What will you build first?

        
Abre la Terminal, escribe claude y cuéntale tu idea. Lo peor que puede pasar es que aprendas algo.Open Terminal, type claude and tell it your idea. The worst that can happen is you learn something.

        Ir al creador de promptsGo to the prompt builder