Agentes, MCP e projetos · Tutorial prático

Como publicar uma aplicação na Vercel e confirmar que funciona

Para publicar uma aplicação na Vercel, identifica a versão que queres colocar no ar, configura o projeto e acompanha o deployment. Depois, abre o endereço final e testa os percursos importantes. Um build concluído confirma uma etapa técnica; precisas também de verificar páginas, formulários, acessos e integrações que fazem parte da entrega.

Projeto local, versão guardada e aplicação publicada ligados por um percurso. Ilustração conceptual gerada com IA.
Ilustração gerada com IA para o Laboratório da IA.

Define o que significa publicar o teu projeto

Antes de começares, escreve o resultado que uma pessoa deve conseguir obter na aplicação publicada. Pode ser consultar uma página, enviar um pedido ou entrar numa área reservada. Essa definição orienta a verificação e evita que consideres o trabalho terminado só porque a página inicial abriu sem um erro visível.

Vamos usar um exemplo fictício: uma pequena aplicação para receber pedidos de orçamento. Tem uma página de apresentação, um formulário e uma confirmação de envio. O percurso só fica validado quando o pedido chega ao destino previsto com os campos certos, sem ficar perdido entre a interface e o serviço que o recebe. Se ainda estás a definir esse resultado, prepara primeiro o briefing da aplicação que vais construir com IA.

Distingue três momentos do trabalho. Guardar uma alteração no computador modifica o projeto local. Criar e enviar uma versão para um repositório conserva esse código no serviço escolhido. Publicar cria uma versão executável no alojamento. Uma ligação automática pode aproximar estes passos, mas não elimina a necessidade de reconhecer qual deles aconteceu.

A Vercel suporta diferentes formas de deployment, incluindo integração com Git e utilização da sua ferramenta de linha de comandos. Neste guia, o percurso principal usa um repositório Git já preparado. Se escolheres outro método, mantém os mesmos critérios de versão, configuração e verificação final.

Prepara uma versão que consigas identificar

Escolhe uma alteração concreta e confirma os ficheiros que pertencem à entrega. O objetivo é conseguires relacionar o que viste localmente com o que vai ser construído e servido online. Se houver trabalho incompleto na mesma pasta, separa-o antes de publicares para não incluir mudanças que ainda não foram revistas.

No exemplo do formulário, começa por conferir o título, os campos, a mensagem de confirmação e o destino do pedido. Se o projeto tiver uma rotina de build, executa-a conforme as instruções do próprio projeto. Se falhar, observa o erro e corrige a causa antes de avançar para a publicação.

Não coloques credenciais, exportações de clientes ou ficheiros de trabalho privados no repositório para resolver uma falha de configuração. Faz um inventário do que a aplicação precisa: código, imagens públicas, configurações, serviços externos e dados persistentes. Cada elemento deve ter um destino adequado.

Regista a revisão do código que vais publicar. Num percurso com Git, o identificador do commit permite distinguir duas versões mesmo que tenham títulos semelhantes. O guia para usar Git e recuperar uma versão do projeto ajuda a organizar esse histórico.

Se trabalhas com um agente de IA, indica o âmbito da tarefa: preparar localmente, enviar para o repositório ou publicar. Uma autorização para corrigir um texto não descreve, por si só, todos os efeitos de uma migração de dados. Por outro lado, quando já decidiste publicar aquela alteração, regista essa decisão para o agente não voltar a perguntar por rotina.

Liga o repositório e confere a configuração

Ao criar o projeto na Vercel, confirma a conta, o repositório e a pasta que contém a aplicação. Estas escolhas determinam o que será construído. Num repositório com vários projetos, selecionar a pasta errada pode produzir um erro ou publicar uma aplicação diferente da que estavas a rever no computador.

O percurso documentado de publicação através de Git começa em New Project. Selecionas o repositório e revês o nome, o framework, a diretoria de raiz, as opções de build e as variáveis de ambiente antes de iniciar o deployment. Não alteres uma configuração detetada apenas para fazer desaparecer uma mensagem: compara-a com a estrutura real do projeto.

Confirma também a branch de produção. Muitas equipas usam main, mas o nome configurado no projeto é que importa. Uma ligação automática pode publicar alterações enviadas para essa branch; por isso, identifica-a antes de fazeres o próximo envio.

Se o repositório não aparecer, verifica a conta e as permissões da integração. Não tornes código privado público apenas para contornar um problema de acesso. Resolve a ligação correta e confirma que a pessoa ou equipa responsável consegue manter o projeto depois da primeira publicação.

Guarda uma nota com o nome do projeto, a origem do código e a pasta de raiz. Esta informação ajuda a evitar confusões quando existem ambientes semelhantes ou vários projetos com nomes quase iguais. Não precisas de guardar tokens nessa nota; basta identificar onde a configuração é gerida.

Separa configuração de teste e de produção

Uma aplicação pode funcionar localmente e falhar online porque depende de valores que só existem no teu computador. Identifica essas dependências e configura cada ambiente de forma intencional. Confirma ainda que os testes usam os serviços previstos, para não criar pedidos reais enquanto estás apenas a verificar uma nova versão.

As variáveis de ambiente da Vercel permitem configurar valores fora do código e aplicá-los aos ambientes selecionados. A documentação distingue valores Config e Secret; alterações nessas variáveis aplicam-se a novos deployments, não modificam automaticamente os anteriores. Depois de corrigires um valor, publica uma nova versão que o utilize.

No nosso exercício, o formulário pode precisar do endereço do serviço que recebe os pedidos. Em teste, esse endereço deve apontar para um destino de ensaio. Em produção, deve apontar para o destino autorizado. Usar a mesma variável com valores diferentes só ajuda se confirmares qual ficou associado ao deployment que estás a abrir.

Uma chave guardada na configuração continua a poder ser exposta se o código a enviar para o navegador. Revê onde cada valor é usado. O utilizador precisa de receber a página e os dados permitidos; uma credencial privada de um serviço deve permanecer na parte da aplicação que a utiliza sem a revelar ao visitante.

Faz uma lista curta: nome da variável, finalidade, ambiente e forma de confirmar o funcionamento. Evita copiar os valores secretos para capturas, conversas ou relatórios. Para diagnosticar uma falha, começa por verificar presença, âmbito e mensagem de erro, sem mostrar a credencial inteira.

Confirma se estás numa primeira publicação ou numa atualização

O percurso de uma aplicação nova tem uma diferença importante face à atualização de um projeto já publicado. Antes de iniciar o deployment, confirma qual dos casos tens em mãos. Isso ajuda-te a escolher o momento de testar e impede que assumes que qualquer endereço temporário corresponde automaticamente a um ambiente sem efeitos reais.

Segundo a documentação de ambientes da Vercel, o primeiro deployment de um projeto novo é de produção. Depois desse primeiro, as regras habituais de preview aplicam-se às branches de desenvolvimento. Confirma sempre o ambiente indicado no projeto, mesmo quando usas um endereço gerado pela plataforma.

Num projeto existente, podes preparar uma atualização numa branch de preview e testá-la antes de a levar para a branch de produção. O isolamento depende também das credenciais e recursos usados: uma página de preview ligada à base de dados real pode continuar a escrever nessa base de dados.

Para uma primeira publicação do formulário fictício, mantém o destino de ensaio enquanto verificas o percurso e controla quem consegue aceder ao projeto. Só liga o destino operacional quando a versão e a configuração estiverem prontas. O nome do ambiente não substitui a decisão sobre os efeitos permitidos.

Ao pedir ajuda à IA, descreve esta situação concretamente: projeto novo ou existente, versão pretendida, ambiente e serviços que podem ser usados. Pede que identifique o deployment resultante e o teste realizado. “Publicado com sucesso” é pouco informativo sem saber onde e com que configuração.

Três áreas de verificação de uma publicação: página, percurso e recuperação. Ilustração conceptual gerada com IA.
Três áreas de verificação de uma publicação: página, percurso e recuperação. Ilustração conceptual gerada com IA. Ilustração gerada com IA.

Acompanha o build e testa o comportamento

Quando o deployment terminar, abre a versão resultante e executa os percursos definidos no início. O estado de construção ajuda a localizar falhas técnicas, mas não verifica por ti a intenção de cada botão. Confirma o que uma pessoa consegue fazer e o que acontece nos serviços ligados à aplicação.

Se o build falhar, procura a primeira mensagem útil e relaciona-a com a configuração ou alteração recente. Um ficheiro em falta, uma importação incorreta e uma variável ausente exigem correções diferentes. Mudar várias opções ao mesmo tempo dificulta perceber qual resolveu o problema.

No formulário de orçamento, prepara um pedido fictício reconhecível e usa apenas dados de teste. Submete-o uma vez, observa a resposta e procura o registo no destino. Confere os campos e verifica se a confirmação apresentada corresponde ao que aconteceu. Uma mensagem de sucesso sem registo final é um problema do percurso.

VerificaçãoExemplo de açãoEvidência útil
PáginaAbrir a apresentação no telemóvelTexto, imagens e botões utilizáveis
FormulárioEnviar uma amostra válidaRegisto correto no destino de teste
ValidaçãoDeixar um campo obrigatório vazioMensagem clara e ausência de envio indevido
NavegaçãoAbrir uma página interna diretamentePágina certa, sem depender da visita à inicial
RepetiçãoRepetir uma ação conforme o caso previstoComportamento coerente com a regra definida

Se a alteração foi criada com IA, usa também o guia para rever alterações de código sugeridas por um agente. Testa o percurso que mudou e os efeitos próximos, em vez de concluir que toda a aplicação foi auditada por teres verificado um formulário.

Liga o domínio e volta a verificar o endereço final

Depois de validares a versão, confirma o domínio que deve apresentar a aplicação e a forma como os visitantes chegam até ela. Uma verificação no endereço do deployment não cobre automaticamente o endereço público definitivo. Redirecionamentos, configuração de serviços e referências antigas podem produzir diferenças que só aparecem nesse último passo.

A documentação de domínios da Vercel indica a configuração em Settings > Domains. Adiciona o domínio e segue os valores DNS apresentados para o teu projeto. Não copies o destino de outro site. Se queres acesso com e sem www, configura ambos e define qual deve ser o endereço principal.

Antes de alterar os registos, guarda a configuração atual e identifica os que servem o site. Preserva os registos de email e de outros serviços. Mudar o alojamento de uma página não implica transferir toda a gestão do domínio nem apagar verificações que continuam a ser necessárias.

Abre o endereço final, confirma HTTPS e repete o percurso principal. Testa uma ligação para uma página interna e observa os redirecionamentos. Se o formulário depende de origens autorizadas ou de um endereço de retorno, verifica também essas definições no serviço correspondente.

Numa migração, mantém a versão anterior disponível enquanto validas a substituição. Faz um inventário dos endereços importantes e decide o destino de cada um. Uma nova página inicial não preserva automaticamente artigos, formulários ou ligações antigas que as pessoas ainda usam.

Prepara a recuperação e regista a entrega

Antes de fechares a publicação, identifica a versão anterior utilizável e o procedimento para recuperar de uma falha. Inclui os serviços externos nessa avaliação. Voltar ao código anterior pode resolver uma interface partida, mas não desfaz necessariamente pedidos enviados, alterações de dados ou configurações modificadas noutro sistema durante a operação.

A função Instant Rollback da Vercel permite voltar a um deployment elegível, com condições que dependem do plano e das permissões. A documentação pede atenção aos domínios e aos serviços externos. Depois de um rollback, a atribuição automática dos domínios de produção fica desligada até retomares o processo de promoção previsto.

Não assumes que carregar novamente o código antigo recupera uma base de dados. Se a atualização alterou a estrutura ou o significado dos dados, tens de avaliar a compatibilidade com a versão anterior. Para uma alteração simples de texto, o plano pode ser curto; para uma migração, precisa de cobrir mais componentes.

Regista a revisão do código, o deployment, o endereço final e os testes realizados. Acrescenta as limitações reais: por exemplo, “formulário conferido com uma amostra de teste; pagamento não incluído neste ensaio”. Essa nota ajuda a distinguir o que foi observado do que ainda precisa de validação.

Depois da publicação, acompanha erros e confirma os primeiros resultados do percurso alterado. Se uma pessoa reportar um problema, pede o comportamento observado, o momento e o passo em que ocorreu, sem recolher credenciais. Uma entrega bem documentada permite comparar esse relato com a versão que está realmente no ar.

Como podes aprender no Laboratório da IA

No Laboratório da IA podes aprender a construir projetos com agentes, rever o que foi produzido e preparar a publicação com critérios concretos. As aulas semanais e os Zooms de acompanhamento semanais permitem trabalhar dúvidas sobre versões, configuração e testes, ligando o código ao resultado que queres disponibilizar às pessoas.

Começa com um projeto pequeno e um percurso verificável. Aprende a identificar a versão, observar o deployment e confirmar o resultado no endereço final. O botão de entrada no Laboratório está disponível nesta página para dares continuidade à prática.

Referências

As fontes oficiais seguintes apoiam os nomes das opções e os comportamentos da plataforma descritos neste guia. Foram verificadas na revisão editorial. O formulário de orçamento é um exercício fictício, sem deployment de demonstração associado, e os testes propostos devem ser adaptados às dependências e ao âmbito do teu projeto.

Aprofunda este percurso no LAB

Aprender Claude CodeAprender vibe coding
Passa à prática

Aprende a construir isto no Lab.

Trabalha o processo com aulas, materiais e acompanhamento. Leva o que estás a construir e esclarece as dúvidas da tua implementação.

  • Distinguir código local, revisão no repositório e deployment.
  • Conferir configuração, percursos e recuperação antes de fechar a entrega.
  • Praticar projetos com agentes nas aulas e Zooms semanais do Laboratório.

Aulas semanais para aprender e aplicar. Zooms de acompanhamento semanais para esclarecer dúvidas. Replay e materiais para retomar o trabalho ao teu ritmo.

Entrar no Laboratório da IA

Continua a aprender

Como usar Git para recuperar uma versão do teu projetoComo rever alterações de código sugeridas pela IAComo preparar o briefing de uma aplicação que vais construir com IA
Laboratório da IA

Inscrições encerradas

Entra na lista de espera.

Deixa o teu contacto para entrares na lista de espera. A nossa equipa liga-te para te explicar como funciona o Laboratório e para seres dos primeiros a saber quando houver uma nova oportunidade de entrar.

O telemóvel serve para a nossa equipa te contactar sobre o Laboratório.

Os teus dados estão seguros connosco. Consulta a nossa Política de Privacidade.

Entrar na lista de espera é gratuito e não implica qualquer pagamento.