Do prompt à produção: como publicar um app Next.js gerado por IA

O link de preview é onde a maioria dos apps construídos com IA vai morrer. O app funciona, você compartilha a URL de preview com dois amigos, e três semanas depois o projeto está abandonado — porque um preview nunca foi o produto. Produção é: sua própria URL, usuários reais e infraestrutura que não depende de você manter uma aba do navegador aberta.

A boa notícia: se o seu builder gerou um projeto Next.js padrão, o caminho até a produção é curto e bem pavimentado. Este passo a passo usa o fluxo da Massvai, mas o formato se aplica a qualquer builder que te entrega código de verdade.

Antes do deploy: uma auditoria de 10 minutos

Resista à vontade de publicar no segundo em que o preview parecer certo. Verifique quatro coisas primeiro:

1. Clique em todos os caminhos que um estranho clicaria. Não o caminho feliz que você já testou trinta vezes — os esquisitos. Envie formulários vazios. Visite a página de detalhes de algo que não existe. Se o app tem autenticação, tente acessar uma página deslogado. Conte ao agente sobre qualquer coisa que quebrar; corrigir antes do lançamento custa uma iteração, corrigir depois custa usuários.

2. Faça o inventário dos seus segredos. Liste todos os serviços externos com os quais o app conversa — banco de dados, provedor de autenticação, processador de pagamentos, e-mail. Cada um tem chaves, e essas chaves devem viver em variáveis de ambiente, nunca no código. A Massvai gerencia as variáveis de ambiente do projeto explicitamente e as injeta nos deploys; seja qual for a plataforma que você usa, confirme que o código gerado lê de process.env em vez de fixar valores no código.

3. Separe dados de teste de dados reais. Se você construiu contra um banco de dados de teste ou chaves de teste do Stripe, a produção precisa dos próprios valores. Este é o bug de dia de lançamento mais comum que existe: o app funciona perfeitamente com credenciais de teste que não podem atender usuários reais.

4. Crie um checkpoint. Fotografe a versão exata que você está prestes a lançar. Quando continuar iterando na semana que vem, você vai querer um estado sabidamente bom para comparar — ou para o qual reverter.

Passo 1: leve o código para o seu próprio GitHub

Mesmo que o seu builder consiga publicar diretamente, sincronize o repositório com a sua própria conta do GitHub primeiro. Isso importa por três motivos: é o seu backup, é o seu caminho de transição quando um desenvolvedor entrar, e é o que se conecta ao pipeline de deploy via git da Vercel — cada push futuro publica automaticamente.

Na Massvai esse fluxo é nativo: conecte sua conta do GitHub, escolha um nome de repositório, faça o push. Verifique o resultado abrindo o repositório e confirmando que você vê um projeto Next.js normal — diretório app/, package.json, arquivos TypeScript. Esse é o seu ativo.

Passo 2: faça o deploy na Vercel

A Vercel é a resposta padrão para hospedar Next.js por um motivo entediante e prático: suporte sem configuração para todos os recursos do Next.js (server components, rotas de API, otimização de imagens), uma CDN global e HTTPS automático. O plano gratuito Hobby roda tranquilamente pequenos apps em produção.

O fluxo guiado da Massvai conecta sua conta da Vercel, cria o projeto, carrega suas variáveis de ambiente e dispara o build. Fazer manualmente é pouco mais difícil: importe o repositório do GitHub no painel da Vercel, cole as variáveis de ambiente e clique em deploy.

De um jeito ou de outro, o primeiro build é o momento da verdade. Um projeto gerado que compila limpo no preview quase sempre compila limpo na Vercel — mas se falhar, leia o log: o erro geralmente é uma variável de ambiente faltando, e o log vai dizer qual.

Passo 3: conecte um domínio próprio

seu-app.vercel.app funciona, mas um domínio de verdade muda como as pessoas tratam o produto — e é a parte em que não desenvolvedores mais empacam, então aqui vai por completo:

1. Compre o domínio em qualquer registrador (algo em torno de US$ 10–15/ano para um .com).
2. Adicione-o ao seu projeto (nas configurações de domínio da Massvai ou no painel da Vercel).
3. A plataforma mostra um ou dois registros DNS para adicionar — tipicamente um registro A ou um CNAME. Cole-os no painel de DNS do seu registrador.
4. Aguarde a propagação — de minutos a algumas horas. Os certificados HTTPS são emitidos automaticamente assim que os registros resolverem.

É isso. Nenhuma administração de servidor está envolvida em momento algum.

Passo 4: a primeira semana em produção

O lançamento é uma linha de largada. Três hábitos para a primeira semana:

• Observe o comportamento real. Adicione uma ferramenta leve de analytics e veja para onde as pessoas realmente vão — nunca é para onde você esperava. Isso vira o seu roadmap de iteração.
• Continue lançando pequeno. Com o GitHub conectado à Vercel, toda mudança sincronizada publica automaticamente. O intervalo entre "o usuário reportou" e "está corrigido em produção" pode ficar abaixo de uma hora, e essa velocidade é a sua maior vantagem sobre concorrentes estabelecidos.
• Reverta sem vergonha. Deploy ruim? A Vercel mantém cada deploy anterior a um clique de distância, e os checkpoints do seu builder te dão a mesma rede de segurança no nível do código. O custo de um erro é de minutos, então arrisque.

A parte que realmente importa

Nenhum desses passos exige mais habilidade de engenharia — essa é a mudança que os AI app builders trouxeram. O que eles não podem fazer é colocar a coisa na frente das pessoas por você. O app na sua aba de preview vale exatamente nada até que outra pessoa o use. Publique esta semana.