Como criar um app mobile com Claude Code: o guia de A a Z (2026)

- As ferramentas de mobile evoluem rápido (Expo SDK, EAS), então eu uso comandos no estilo @latest para este guia não ficar desatualizado.

O Claude Code consegue criar um app mobile?

Sim - o Claude Code consegue criar um app mobile, e faz um bom trabalho se você ficar numa stack JavaScript. O Claude Code é a ferramenta de linha de comando agêntica da Anthropic: ele lê o seu repositório inteiro, escreve e edita arquivos, roda comandos no terminal (como npx expo start ou eas build), lê os logs de erro e itera sozinho até o app rodar (Anthropic - Claude Code docs, 2026).

Isso faz do Claude Code um parceiro ideal para vibe-coding de um app de celular: você foca no que o app deve fazer, e ele cuida da digitação repetitiva. Com React Native + Expo, toda a cadeia - montar a estrutura, rodar o servidor de desenvolvimento, empacotar um .apk ou uma build do TestFlight - são comandos de CLI, que é exatamente onde o Claude Code brilha.

Vou ser franca: o Claude Code não substitui a sua compreensão do produto. Ele é rápido na parte de "criar um app mobile com IA" na camada JS/UI, mas módulos nativos profundos (Swift/Kotlin) e o processo de revisão da loja ainda precisam de você. Se você é totalmente iniciante, leia antes o que é o Claude Code para ver como ele funciona.

Comparado com digitar cada arquivo na mão ou copiar e colar de uma janela de chat, a maior diferença é que o Claude Code trabalha dentro do seu projeto: ele enxerga a estrutura de pastas do Expo Router, lê o package.json para saber quais bibliotecas você usa e consegue rodar o servidor de desenvolvimento e ler os erros de volta sozinho. O loop de "editar, rodar, ler o erro, corrigir de novo" fica fechado ali no terminal, então você raramente fica pulando entre um navegador e um editor. Esse jeito de trabalhar é exatamente por que ele se encaixa no mobile - onde cada mudança precisa de uma nova execução no Expo Go para conferir.

Preparação: escolha uma stack e configure seu ambiente

Antes de digitar um único comando, escolha uma stack. Esta é a matriz que eu uso para decidir - a mesma lógica da skill de mobile-app no AgentKit:

Este guia segue Expo + React Native por ser o caminho mais rápido até um app rodando. O que você precisa:

• Node LTS (a versão mais recente, para o npx funcionar).
• Expo Go instalado num celular real (iOS App Store / Google Play) - assim você vê o app na hora, sem build.
• Claude Code instalado na sua máquina - veja o guia de instalação do Claude Code.
• O macOS só é necessário para compilar a versão iOS para a App Store. Todo o resto (programar, testar no Android, desenvolver no Expo Go) roda tranquilo no Windows/Linux.

Você não precisa ter o Xcode ou o Android Studio instalados para começar - o Expo Go dá conta das execuções de teste, e a etapa de build nativo acontece na nuvem pelo EAS (explicada na Etapa 6).

Etapa 1 - Planeje o app com o Claude Code

Não diga para a IA "programe um app pra mim" e a deixe sair digitando. A jogada mais valiosa é travar o escopo antes de existir uma única linha de código. Eu abro o Claude Code em modo de planejamento e descrevo o app que quero - para este guia estou criando um pequeno rastreador de hábitos: uma lista de hábitos, uma marcação diária e uma visão de sequência (streak).

O prompt que eu uso, mais ou 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.

O Claude Code devolve um mapa de telas e um modelo de dados para você revisar. Corrigir as coisas na camada de planejamento é bem mais barato do que corrigir depois que já existem 20 arquivos. Para se aprofundar nessa técnica, veja como planejar um projeto com o Claude Code.

Etapa 2 - Monte o projeto Expo + um CLAUDE.md para mobile

Com o plano definido, deixe o Claude Code (ou você) rodar os comandos de criação do projeto:

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

O create-expo-app configura a estrutura com o Expo Router (roteamento baseado em arquivos, como o Next.js). O npx expo start sobe o servidor de desenvolvimento e mostra um QR code - escaneie com o Expo Go no seu celular e o app roda na hora, sem precisar de build.

A única coisa que faz a maior diferença na qualidade do resultado é um CLAUDE.md para mobile. Este é o "arquivo de convenções" que o Claude Code lê toda vez que trabalha - coloque-o na raiz do repositório. Meu template para copiar e colar:

# 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

Esse arquivo mantém o Claude Code nas mesmas convenções ao longo de toda a sessão - em vez de construir as coisas de um jeito diferente a cada vez. Para entender o mecanismo do CLAUDE.md a fundo, veja o guia do CLAUDE.md.

Etapa 3 - Construa as telas (UI) com o Claude Code

É aqui que o vibe-coding compensa. A regra que eu sempre mantenho: construa uma tela de cada vez e confira no Expo Go depois de cada uma. Não deixe a IA cuspir seis telas de uma vez e depois ficar ali desembaraçando tudo.

A ordem que eu sigo no rastreador de hábitos: tela de lista, depois tela de detalhe, depois o formulário de adicionar/editar. O prompt para a primeira tela, mais ou 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.

Depois de cada tela, escaneie o QR de novo no Expo Go para ver de verdade. Se algo estiver errado (espaçamento, cor, navegação), descreva para o Claude Code e deixe que ele continue corrigindo - esse loop é bem rápido graças ao hot reload. Na parte de construir a interface, a técnica de prompt de UI é idêntica à da web; veja como construir UIs em React com o Claude Code e dicas de UI/UX para trabalhar com o Claude Code.

Etapa 4 - Adicione estado, dados e um backend

O app já tem uma UI, mas ele não "lembra" de nada. Hora de ligar os dados. Para um app de porte pequeno a médio, eu uso Zustand para o estado e AsyncStorage para a persistência local - e a parte mais importante é ser offline-first: as redes móveis são instáveis, então o app tem que funcionar quando o sinal cai e sincronizar depois.

Peça ao Claude Code para construir o store + a persistência:

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.

Quando você precisar de sincronização entre vários dispositivos ou de login, é aí que você adiciona um backend. Uma opção rápida e leve é um backend-as-a-service (o Supabase, por exemplo) para autenticação + banco de dados; o Claude Code consegue escrever tanto a camada de chamadas de API quanto o schema. Se preferir subir a sua própria API, veja como criar uma API de backend com o Claude Code; para o design das tabelas, tem como trabalhar com bancos de dados usando o Claude Code.

Uma dica prática: peça ao Claude Code para separar a camada de armazenamento (store + persistência) da camada de UI desde o começo. Depois, quando você trocar o AsyncStorage por um backend de verdade, você mexe em um só lugar em vez de vasculhar cada tela. Este também é o momento de pedir que ele escreva algumas funções pequenas de cálculo (como computeStreak) com testes, porque lógica de data é fácil de errar de um jeito sutil.

Uma regra de segurança que não dá para pular: nunca coloque chaves de API no código (elas são fáceis de expor quando o app é descompilado) - use variáveis de ambiente e, para dados sensíveis, guarde via Keychain (iOS) / KeyStore (Android). Se o app tem tela de login, prefira OAuth2 + JWT e considere o desbloqueio biométrico (Face ID / impressão digital) para uma experiência mobile mais fluida.

Etapa 5 - Depure e teste num dispositivo real

A lição mais cara que todo iniciante em mobile aprende: o simulador mente sobre desempenho. Ele roda na CPU parruda do seu computador, então tudo parece suave; num celular intermediário, os travamentos, o consumo de bateria e os carregamentos lentos finalmente aparecem. Sempre teste uma build próxima do lançamento num dispositivo real.

Como depurar com o Claude Code: cole o log de erro cru (do terminal do Expo ou da tela de erro vermelha dentro do app) na sessão e deixe que ele leia e corrija. Ele acompanha bem os stack traces do React Native. Alguns erros específicos de mobile que você vai encontrar com frequência:

• Cache antigo do bundler Metro: você edita o código mas o app não muda - rode npx expo start -c para limpar o cache.
• Versão errada do Expo SDK: uma biblioteca é incompatível com o SDK - use npx expo install <package> (ele escolhe a versão compatível com o SDK) em vez de npm install.
• Módulo nativo precisa de rebuild: você adiciona uma biblioteca com parte nativa - ela não vai aparecer no Expo Go; você tem que fazer uma development build (npx expo run:android / run:ios).

Para outros erros estranhos da própria ferramenta, veja a compilação de erros comuns do Claude Code e como corrigi-los.

Etapa 6 - Publique na App Store e no Google Play (EAS Build)

O Expo Go é só para desenvolvimento. Para conseguir um arquivo instalável de verdade ou publicar numa loja, use o EAS Build - o serviço de build em nuvem do Expo, para você compilar iOS até sem 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

Assim que tiver uma build:

• iOS: envie pelo TestFlight para testes internos e depois submeta à App Store. Você precisa do Apple Developer Program a 99 USD/ano (Apple Developer, 2026).
• Android: use primeiro o teste interno do Google Play e depois amplie aos poucos, de Fechado para Aberto até Produção. A taxa de registro de desenvolvedor do Google Play é um pagamento único no momento de criar a conta.

A estratégia de lançamento que eu recomendo: não empurre direto para produção. Siga a escada do rollout escalonado - uma build interna para poucas pessoas, depois teste fechado para um grupo maior, depois aberto/produção. Cada degrau é uma chance de pegar bugs em dispositivos reais antes de chegar à multidão. O Claude Code pode ajudar com a configuração do eas.json (os perfis de build) e com scripts de automação, mas a decisão de "quando subir um degrau" é sua.

Um aviso honesto para o seu plano não quebrar: a revisão da App Store costuma levar alguns dias e pode ser devolvida se violar uma diretriz - esta é uma etapa humana, e nenhuma IA a encurta. Para deixar o fluxo de empacotamento/publicação mais tranquilo, veja como fazer deploy de apps com o Claude Code. Configure o EAS em detalhes conforme a documentação oficial (Expo - Claude Code docs, 2026).

Acelere: a skill ak-mobile-development embutida no AgentKit

Para evitar confusão: "AgentKit" aqui é o kit de skills/agentes para o Claude Code em agentkit.best (usado pela CLI ak) - diferente do produto AgentKit da OpenAI.

Se você prefere não escrever o seu próprio CLAUDE.md e escolher as convenções de mobile do zero toda vez, o Engineer Kit (que inclui a skill de mobile) traz a skill ak-mobile-development: a matriz de escolha de framework, um padrão offline-first, o fluxo do EAS Build e um checklist de segurança mobile da OWASP - o Claude Code lê tudo diretamente e aplica. O Engineer Kit está atualmente a 99 USD (o site não lista cobrança recorrente) com atualizações vitalícias e garantia de reembolso. Quer primeiro a visão geral? Leia o que é o AgentKit ou simplesmente conheça o AgentKit (20% de desconto pelo link). Não é obrigatório - você consegue fazer tudo isso perfeitamente com o template da Etapa 2.

Os limites reais de criar um app mobile com o Claude Code

Para você calibrar bem as expectativas, aqui está onde o Claude Code deixa a desejar - as coisas que nenhum concorrente vai admitir:

• Módulos nativos profundos: código Swift/Kotlin complexo (Bluetooth, câmera avançada, processamento em segundo plano) é onde a IA escorrega, e você mesma precisa entender o nativo.
• iOS exige o ecossistema Apple: compilar/assinar iOS precisa de macOS ou de um serviço em nuvem (EAS) mais uma conta Apple paga - a IA não contorna essa restrição.
• A revisão da loja está fora do alcance da IA: Apple/Google revisam à mão; nenhum "prompt" aprova o seu app mais rápido.
• É fácil o escopo inflar: se você pular a Etapa 1 (planejamento), o app cresce sem controle. Um plano enxuto é a forma mais barata de evitar isso.

Perguntas frequentes (FAQ)

Dá para criar um app iOS com o Claude Code sem um Mac?

Sim. Você programa e testa no Expo Go a partir do Windows/Linux normalmente e depois usa o EAS Build (a build em nuvem do Expo) para gerar a versão iOS sem um Mac. Você só precisa de uma conta Apple Developer paga para enviar ao TestFlight/à App Store.

Devo usar Expo ou bare React Native?

Iniciantes devem começar com o Expo: configuração rápida, testes instantâneos pelo Expo Go, builds em nuvem via EAS. Só migre para o bare React Native quando precisar de um módulo nativo que o Expo não suporta.

Dá para criar um app mobile com o Claude Code se eu não sei programar?

Você consegue criar um app simples no estilo vibe-coding, mas ainda deve entender o básico: ler erros, saber o que o app deve fazer e conseguir revisar os resultados. Sem nenhum conhecimento de programação, depurar é difícil e o escopo tende a inflar.

O Claude Code consegue criar um app em Flutter?

Sim, o Claude Code escreve Dart/Flutter bem. Mas este guia recomenda Expo + React Native porque a cadeia de comandos de CLI combina melhor com o fluxo agêntico, deixando a IA rodar e corrigir as coisas por conta própria.

Quanto tempo leva para publicar um app nas lojas?

O código em si pode sair em algumas sessões. O gargalo é a revisão: a App Store costuma levar alguns dias e pode devolver o app; o Google Play geralmente é mais rápido. É um processo humano, não algo que a IA encurta.

Quanto custa criar e lançar um app?

O código em si é gratuito (Expo e React Native são open source). Custos principais: o plano do Claude Code que você usa (Pro a partir de 20 USD/mês), o Apple Developer a 99 USD/ano se você for para a App Store e a taxa de registro do Google Play quando publicar no Android.

Conclusão + próximos passos

Para recapitular as seis etapas: planejar, montar Expo + CLAUDE.md, construir as telas uma de cada vez, adicionar estado/dados, testar num dispositivo real e publicar pelo EAS. O Claude Code cuida da digitação; você é dona do escopo e da revisão do resultado. Próximos passos: aprofunde-se em construir UIs com o Claude Code e no fluxo de deploy. E se você quer pular a parte de escrever suas próprias convenções de mobile, o AgentKit para o Claude Code (20% de desconto pelo link) traz uma skill pronta para você começar mais rápido.