Herramientas de IA para Programar

Crea una app móvil con Claude Code: la guía de la A a la Z (2026)

20 ago 202615 min de lectura

Sí - Claude Code puede crear una app móvil. El camino más rápido es la stack Expo + React Native: tú describes la app, y Claude Code (la CLI agéntica de Anthropic) monta la estructura del proyecto, escribe cada pantalla, ejecuta los comandos de Expo/EAS y corrige sus propios errores en bucle. El flujo tiene seis pasos: planear la app, montar Expo, construir la UI, conectar los datos, probar en un teléfono real y publicar en las tiendas. Necesitas Node LTS y un teléfono; solo necesitas macOS cuando compiles la versión iOS para la App Store.

- Las herramientas de móvil evolucionan rápido (Expo SDK, EAS), así que uso comandos al estilo @latest para que esta guía no quede desactualizada.

¿Puede Claude Code crear una app móvil?

Sí - Claude Code puede crear una app móvil, y lo hace bien si te quedas en una stack de JavaScript. Claude Code es la herramienta de línea de comandos agéntica de Anthropic: lee todo tu repositorio, escribe y edita archivos, ejecuta comandos de terminal (como npx expo start o eas build), lee los registros de errores e itera por su cuenta hasta que la app funciona (Anthropic - Claude Code docs, 2026).

Eso convierte a Claude Code en un socio ideal para hacer vibe-coding de una app de teléfono: tú te centras en lo que la app debe hacer, y él se encarga de la escritura repetitiva. Con React Native + Expo, toda la cadena - montar la estructura, ejecutar el servidor de desarrollo, empaquetar un .apk o una build de TestFlight - son comandos de CLI, que es justo donde Claude Code brilla.

Seré sincera: Claude Code no reemplaza tu comprensión del producto. Es rápido en la parte de "crear una app móvil con IA" en la capa JS/UI, pero los módulos nativos profundos (Swift/Kotlin) y el proceso de revisión de la tienda todavía te necesitan a ti. Si eres totalmente nueva, lee antes qué es Claude Code para ver cómo funciona.

Comparado con teclear cada archivo a mano o copiar y pegar desde una ventana de chat, la mayor diferencia es que Claude Code trabaja dentro de tu proyecto: ve la estructura de carpetas de Expo Router, lee el package.json para saber qué bibliotecas usas y puede ejecutar el servidor de desarrollo y leer los errores de vuelta por sí mismo. El bucle de "editar, ejecutar, leer el error, corregir de nuevo" se queda cerrado ahí en la terminal, así que rara vez saltas entre un navegador y un editor. Esa forma de trabajar es exactamente por lo que encaja con el móvil - donde cada cambio necesita volver a ejecutarse en Expo Go para comprobarlo.

Preparación: elige una stack y configura tu entorno

Antes de teclear un solo comando, elige una stack. Esta es la matriz que uso para decidir - la misma lógica que la skill de mobile-app en AgentKit:

StackCuándo elegirlaPros / contras con Claude Code
Expo + React Native (por defecto)Equipo JS/TS, prototipado rápido, multiplataforma, quieres hot reloadEncaja muy bien con Claude Code: todo CLI + JS. Contra: las apps con gráficos pesados o muy nativas sufren
Bare React NativeNecesitas un módulo nativo que Expo no admiteSigue siendo JS, pero añade configuración nativa (Xcode/Gradle) - Claude Code ayuda, pero intervienes a mano con más frecuencia
FlutterAnimación/rendimiento pesados, UI consistente al pixelClaude Code escribe Dart bien, pero el ecosistema de comandos es menos "amigable para agentes" que Expo
Nativo (Swift / Kotlin)Necesitas exprimir al máximo la plataformaLo menos apto para vibe-coding - el detalle nativo está fuera de la zona fuerte de la IA

Esta guía sigue Expo + React Native porque es la ruta más rápida a una app funcionando. Lo que necesitas:

  • Node LTS (la versión más reciente, para que funcione npx).
  • Expo Go instalado en un teléfono real (iOS App Store / Google Play) - así ves la app al instante, sin build.
  • Claude Code instalado en tu máquina - mira la guía de instalación de Claude Code.
  • macOS solo es necesario para compilar la versión iOS para la App Store. Todo lo demás (programar, probar en Android, desarrollar en Expo Go) funciona sin problema en Windows/Linux.

No necesitas tener Xcode ni Android Studio instalados para empezar - Expo Go se encarga de las ejecuciones de prueba, y el paso de build nativo ocurre en la nube a través de EAS (se ve en el Paso 6).

Paso 1 - Planea la app con Claude Code

No le digas a la IA "prográmame una app" y la dejes lanzarse a teclear. La jugada más valiosa es fijar el alcance antes de que exista una sola línea de código. Yo abro Claude Code en modo de planificación y describo la app que quiero - para esta guía estoy creando un pequeño rastreador de hábitos: una lista de hábitos, un marcado diario y una vista de racha (streak).

El prompt que uso, más o menos:

I want to build a habit-tracker mobile app with Expo + React Native.
Before writing code, propose:
1. A list of screens (list, detail, add/edit a habit, stats)
2. A data model (habit, daily tick log)
3. State + local storage (offline-first)
Do not write code yet. Just settle the plan for me to review.

Claude Code devuelve un mapa de pantallas y un modelo de datos para que lo revises. Arreglar las cosas en la capa de planificación es mucho más barato que arreglarlas cuando ya existen 20 archivos. Para profundizar en esta técnica, mira cómo planear un proyecto con Claude Code.

Paso 2 - Monta el proyecto Expo + un CLAUDE.md para móvil

Con el plan definido, deja que Claude Code (o tú) ejecute los comandos de creación del proyecto:

npx create-expo-app@latest habit-tracker
cd habit-tracker
npx expo start

create-expo-app configura la estructura con Expo Router (enrutado basado en archivos, como Next.js). npx expo start arranca el servidor de desarrollo y muestra un código QR - escanéalo con Expo Go en tu teléfono y la app funciona al instante, sin necesidad de build.

La única cosa que marca la mayor diferencia en la calidad del resultado es un CLAUDE.md para móvil. Este es el "archivo de convenciones" que Claude Code lee cada vez que trabaja - colócalo en la raíz del repositorio. Mi plantilla para copiar y pegar:

# CLAUDE.md - Habit Tracker (Expo + React Native)

## Stack
- Expo (latest SDK) + React Native + TypeScript
- Routing: Expo Router (file-based, app/ directory)
- State: Zustand
- Local storage: AsyncStorage (offline-first, no network dependency)

## Code conventions
- Function components + hooks; NO class components
- File names kebab-case; components PascalCase
- Absolute imports via the @/ alias (configured in metro/tsconfig)
- Style with StyleSheet.create; no hardcoded colors - use the theme in constants/

## Working rules
- Before committing: run `npx tsc --noEmit` and `npx expo lint`, fix all errors
- Each screen lives in app/; split logic into hooks/ if over 100 lines
- Never hardcode API keys; read from env vars / expo-constants
- After a UI change, remind me to re-test on Expo Go

Este archivo mantiene a Claude Code en las mismas convenciones a lo largo de toda la sesión - en vez de construir las cosas de una forma distinta cada vez. Para entender el mecanismo del CLAUDE.md a fondo, mira la guía de CLAUDE.md.

Paso 3 - Construye las pantallas (UI) con Claude Code

Aquí es donde el vibe-coding vale la pena. La regla que siempre mantengo: construye una pantalla a la vez y compruébala en Expo Go después de cada una. No dejes que la IA suelte seis pantallas de golpe y luego te sientes a desenredarlas.

El orden que sigo en el rastreador de hábitos: pantalla de lista, luego pantalla de detalle, luego el formulario de añadir/editar. El prompt para la primera pantalla, más o menos:

Build the habit list screen (app/index.tsx):
- FlatList rendering the habits from the Zustand store
- Each item: habit name, current streak, a "tick today" button
- Empty state: text "No habits yet, add one now"
- Tapping an item navigates to app/habit/[id].tsx (Expo Router)
Follow the conventions in CLAUDE.md. When done, tell me to open Expo Go to check.

Después de cada pantalla, vuelve a escanear el QR en Expo Go para verla de verdad. Si algo está mal (espaciado, color, navegación), descríbeselo a Claude Code y deja que siga corrigiendo - este bucle es muy rápido gracias al hot reload. En la parte de construir la interfaz, la técnica de prompt de UI es idéntica a la de la web; mira cómo construir UIs en React con Claude Code y consejos de UI/UX para trabajar con Claude Code.

Paso 4 - Añade estado, datos y un backend

La app ya tiene una UI, pero no "recuerda" nada. Es hora de conectar los datos. Para una app de tamaño pequeño a mediano uso Zustand para el estado y AsyncStorage para la persistencia local - y la parte más importante es que sea offline-first: las redes móviles son inestables, así que la app tiene que funcionar cuando la señal se cae y sincronizar después.

Pídele a Claude Code que construya el store + la persistencia:

Create a Zustand store (store/habits.ts):
- state: list of habits + daily tick log
- actions: addHabit, toggleTickToday, computeStreak
- persist everything to AsyncStorage (offline-first)
- restore state on app launch
Write full TypeScript types alongside it.

Cuando necesites sincronización entre varios dispositivos o inicios de sesión, ese es el momento de añadir un backend. Una opción rápida y ligera es un backend-as-a-service (Supabase, por ejemplo) para autenticación + base de datos; Claude Code puede escribir tanto la capa de llamadas a la API como el esquema. Si prefieres levantar tu propia API, mira cómo crear una API de backend con Claude Code; para el diseño de las tablas, tienes cómo trabajar con bases de datos usando Claude Code.

Un consejo práctico: pídele a Claude Code que separe la capa de almacenamiento (store + persistencia) de la capa de UI desde el principio. Después, cuando cambies AsyncStorage por un backend de verdad, tocas un solo sitio en lugar de escarbar en cada pantalla. Este también es el momento de que escriba unas cuantas funciones pequeñas de cálculo (como computeStreak) con pruebas, porque la lógica de fechas es fácil de equivocar de forma sutil.

Una regla de seguridad que no hay que saltarse: nunca pongas claves de API en el código (son fáciles de exponer cuando se descompila la app) - usa variables de entorno y, para datos sensibles, guárdalos vía Keychain (iOS) / KeyStore (Android). Si la app tiene pantalla de inicio de sesión, prefiere OAuth2 + JWT y considera el desbloqueo biométrico (Face ID / huella) para una experiencia móvil más fluida.

Paso 5 - Depura y prueba en un dispositivo real

La lección más cara que aprende todo principiante en móvil: el simulador miente sobre el rendimiento. Corre en la potente CPU de tu ordenador, así que todo se siente fluido; en un teléfono de gama media, los tirones, el consumo de batería y las cargas lentas por fin aparecen. Prueba siempre una build cercana al lanzamiento en un dispositivo real.

Cómo depurar con Claude Code: pega el registro de error en crudo (de la terminal de Expo o de la pantalla de error roja dentro de la app) en la sesión y deja que lo lea y lo corrija. Sigue bastante bien los stack traces de React Native. Algunos errores propios del móvil con los que te toparás a menudo:

  • Caché anticuada del bundler Metro: editas el código pero la app no cambia - ejecuta npx expo start -c para limpiar la caché.
  • Versión equivocada del Expo SDK: una biblioteca es incompatible con el SDK - usa npx expo install <package> (elige la versión que coincide con el SDK) en lugar de npm install.
  • Un módulo nativo necesita recompilarse: añades una biblioteca con parte nativa - no aparecerá en Expo Go; tienes que hacer una development build (npx expo run:android / run:ios).

Para otros errores raros de la propia herramienta, mira el recopilatorio de errores comunes de Claude Code y cómo solucionarlos.

Paso 6 - Publica en la App Store y en Google Play (EAS Build)

Expo Go es solo para desarrollo. Para conseguir un archivo instalable de verdad o publicar en una tienda, usa EAS Build - el servicio de build en la nube de Expo, para que puedas compilar iOS incluso sin macOS.

npm install -g eas-cli
eas login
eas build:configure
# Build an internal build for testing:
eas build --profile preview --platform android # produces an .apk
eas build --profile preview --platform ios # needs an Apple Developer account

Una vez que tengas una build:

  • iOS: envíala por TestFlight para pruebas internas y después súbela a la App Store. Necesitas el Apple Developer Program a 99 USD/año (Apple Developer, 2026).
  • Android: usa primero las pruebas internas de Google Play y luego amplía poco a poco, de Cerrada a Abierta hasta Producción. La cuota de registro de desarrollador de Google Play es un pago único al crear la cuenta.

La estrategia de lanzamiento que recomiendo: no empujes directo a producción. Sigue la escalera del despliegue escalonado - una build interna para unas pocas personas, luego pruebas cerradas para un grupo mayor, luego abierta/producción. Cada peldaño es una oportunidad de cazar bugs en dispositivos reales antes de que llegue a la multitud. Claude Code puede ayudar con la configuración de eas.json (los perfiles de build) y con scripts de automatización, pero la decisión de "cuándo subo un peldaño" es tuya.

Un aviso honesto para que tu plan no se rompa: la revisión de la App Store suele tardar unos días y pueden devolvértela si incumple una directriz - este es un paso humano, y ninguna IA lo acorta. Para que el flujo de empaquetado/publicación sea más fluido, mira cómo desplegar apps con Claude Code. Configura EAS en detalle según la documentación oficial (Expo - Claude Code docs, 2026).

Acelera: la skill ak-mobile-development integrada en AgentKit

Para evitar confusiones: "AgentKit" aquí es el kit de skills/agentes para Claude Code en agentkit.best (se usa con la CLI ak) - distinto del producto AgentKit de OpenAI.

Si prefieres no escribir tu propio CLAUDE.md ni elegir las convenciones de móvil desde cero cada vez, el Engineer Kit (que incluye la skill de móvil) trae la skill ak-mobile-development: la matriz de elección de framework, un valor por defecto offline-first, el flujo de EAS Build y una checklist de seguridad móvil de OWASP - Claude Code la lee directamente y la aplica. El Engineer Kit está actualmente a 99 USD (el sitio no indica ninguna cuota recurrente) con actualizaciones de por vida y garantía de devolución. ¿Quieres primero la visión general? Lee qué es AgentKit o simplemente échale un vistazo a AgentKit (20% de descuento por el enlace). No es obligatorio - puedes hacer todo esto perfectamente con la plantilla del Paso 2.

Los límites reales de crear una app móvil con Claude Code

Para que ajustes bien tus expectativas, aquí está donde Claude Code se queda corto - lo que ningún competidor va a admitir:

  • Módulos nativos profundos: el código Swift/Kotlin complejo (Bluetooth, cámara avanzada, procesamiento en segundo plano) es donde la IA resbala, y tienes que entender el nativo tú misma.
  • iOS exige el ecosistema Apple: compilar/firmar iOS necesita macOS o un servicio en la nube (EAS) más una cuenta Apple de pago - la IA no esquiva esta restricción.
  • La revisión de la tienda está fuera del alcance de la IA: Apple/Google revisan a mano; ningún "prompt" aprueba tu app más rápido.
  • Es fácil que el alcance se dispare: si te saltas el Paso 1 (planificación), la app se hincha sin control. Un plan ajustado es la forma más barata de evitarlo.

Preguntas frecuentes (FAQ)

¿Puedo crear una app iOS con Claude Code sin un Mac?

Sí. Programas y pruebas en Expo Go desde Windows/Linux con normalidad y luego usas EAS Build (la build en la nube de Expo) para generar la versión iOS sin un Mac. Solo necesitas una cuenta Apple Developer de pago para enviarla a TestFlight/la App Store.

¿Debo usar Expo o bare React Native?

Quien empieza debería arrancar con Expo: configuración rápida, pruebas instantáneas por Expo Go, builds en la nube vía EAS. Pásate a bare React Native solo cuando necesites un módulo nativo que Expo no admite.

¿Puedo crear una app móvil con Claude Code si no sé programar?

Puedes crear una app sencilla al estilo vibe-coding, pero aun así deberías entender lo básico: leer errores, saber qué debe hacer la app y ser capaz de revisar los resultados. Sin ningún conocimiento de programación, depurar es difícil y el alcance tiende a dispararse.

¿Puede Claude Code crear una app en Flutter?

Sí, Claude Code escribe Dart/Flutter bien. Pero esta guía recomienda Expo + React Native porque la cadena de comandos de CLI encaja mejor con el flujo agéntico, dejando que la IA ejecute y corrija las cosas por su cuenta.

¿Cuánto tarda publicar una app en las tiendas?

El código en sí puede quedar listo en unas pocas sesiones. El cuello de botella es la revisión: la App Store suele tardar unos días y puede devolvértela; Google Play suele ser más rápido. Es un proceso humano, no algo que la IA acorte.

¿Cuánto cuesta crear y lanzar una app?

El código en sí es gratis (Expo y React Native son de código abierto). Costes principales: el plan de Claude Code que uses (Pro desde 20 USD/mes), Apple Developer a 99 USD/año si vas a la App Store y la cuota de registro de Google Play cuando publiques en Android.

Conclusión + próximos pasos

Para recapitular los seis pasos: planear, montar Expo + CLAUDE.md, construir las pantallas una a una, añadir estado/datos, probar en un dispositivo real y publicar mediante EAS. Claude Code se encarga de teclear; tú eres dueña del alcance y de la revisión del resultado. Próximos pasos: profundiza en construir UIs con Claude Code y en el flujo de deploy. Y si quieres saltarte la parte de escribir tus propias convenciones de móvil, AgentKit para Claude Code (20% de descuento por el enlace) trae una skill lista para que empieces más rápido.

J

Jasmine

Autora · Jasmine Daily

La autora detrás de Jasmine Daily, anotando pensamientos, experiencias y momentos cotidianos. Honesta, sin prisa, imperfecta.

Jasmine Daily

Hay más esperando a ser leído.

Si este texto te llegó, explora algunas páginas más del diario.

Leer a continuación

Entradas relacionadas