Como publicar seu site na Vercel — do código ao ar em 10 minutos
Vercel é a forma mais rápida de colocar um site Next.js no ar. Você conecta o repositório, Vercel detecta a configuração e publica automaticamente. Cada novo commit atualiza o site sozinho.
Você criou o site. Ele funciona no seu computador.
Agora ele precisa funcionar para o mundo.
Publicar na internet não é mais um processo complicado. Com Vercel, você conecta o projeto uma vez — e toda atualização futura vai ao ar automaticamente.
O que é Vercel
Vercel é uma plataforma de hospedagem especializada em aplicações modernas, especialmente as feitas em Next.js.
Hospedagem é o serviço que mantém seu site funcionando em um servidor conectado à internet — para que qualquer pessoa, em qualquer lugar, consiga acessar.
Vercel tem um plano gratuito que é suficiente para a maioria dos projetos pessoais, blogs e portfólios.
O que você precisa antes de começar
Uma conta no GitHub. GitHub é onde o código do seu projeto fica armazenado online. Criar uma conta é gratuito em github.com.
Seu projeto em um repositório GitHub. Se você criou o site com Claude Code na lição anterior, o próximo passo é enviar o código para o GitHub.
Uma conta na Vercel. Você cria em vercel.com — pode entrar com a própria conta do GitHub, o que agiliza tudo.
Passo 1: enviar o projeto para o GitHub
Abra o terminal na pasta do seu projeto e rode:
git init
git add .
git commit -m "primeiro commit"
Depois, crie um repositório novo no GitHub:
- Acesse
github.come clique em "New repository" - Dê um nome ao repositório
- Deixe como Private se não quiser que o código seja público
- Clique em "Create repository"
O GitHub vai mostrar os comandos para conectar. Cole no terminal:
git remote add origin https://github.com/seu-usuario/seu-repositorio.git
git push -u origin main
Repositório é uma pasta versionada — o GitHub registra cada mudança que você enviar, permitindo voltar a versões anteriores se necessário.
Agora seu código está no GitHub.
Passo 2: conectar o repositório à Vercel
- Acesse
vercel.come entre com sua conta GitHub - Clique em "Add New Project"
- Vercel vai listar seus repositórios do GitHub
- Selecione o repositório do seu site
- Clique em "Import"
Vercel detecta automaticamente que é um projeto Next.js.
Não precisa configurar nada. Só clique em "Deploy".
Passo 3: aguardar o deploy
Deploy é o processo de publicar a versão atual do código no servidor.
Leva entre 30 segundos e 2 minutos. Você vê o progresso em tempo real.
Quando termina, Vercel mostra uma URL no formato:
https://seu-projeto.vercel.app
Abra no navegador. Seu site está no ar.
Passo 4: conectar um domínio próprio (opcional)
A URL padrão da Vercel funciona. Mas um domínio próprio — como seusite.com.br — passa mais credibilidade.
Para conectar:
- No painel da Vercel, abra seu projeto
- Clique em "Settings" → "Domains"
- Digite seu domínio e clique em "Add"
- Vercel vai mostrar os registros DNS que precisam ser configurados
DNS (Domain Name System) é o sistema que traduz um nome de domínio em um endereço de servidor. Você configura esses registros no painel do serviço onde comprou o domínio — como Registro.br, Namecheap ou GoDaddy.
Copie os valores que a Vercel mostra e cole no painel do seu registro de domínio. A propagação leva entre alguns minutos e algumas horas.
Deploy automático a cada atualização
Esta é a parte mais prática do Vercel.
Toda vez que você enviar uma atualização para o GitHub, a Vercel detecta e publica automaticamente. Você não precisa fazer nada além do:
git add .
git commit -m "descreva o que mudou"
git push
Em 1-2 minutos, a nova versão está no ar.
Se você está usando Claude Code para fazer mudanças no site — o fluxo é:
- Instrui o Claude Code a fazer a mudança
- Verifica localmente com
npm run dev - Envia ao GitHub com
git push - Vercel publica automaticamente
É o fluxo que o próprio Modo Build usa para publicar todo conteúdo e atualização.
O que fazer se o deploy falhar
Erros no deploy aparecem na aba "Build Logs" do painel da Vercel. Você vê exatamente qual linha de código causou o problema.
Copie a mensagem de erro. Cole no Claude Code:
"O deploy na Vercel falhou com esse erro: [mensagem]. Corrige."
Claude identifica a causa e corrige.
Vercel tem um plano gratuito generoso
O plano gratuito da Vercel inclui:
- Projetos ilimitados
- 100 GB de largura de banda por mês
- Deploy automático via GitHub
- HTTPS automático (o cadeado de segurança no navegador)
- Domínio personalizado
Para a maioria dos sites de criadores, blogs e portfólios — o plano gratuito é suficiente por muito tempo.
Do código ao ar: o resumo
O processo completo de publicação é:
- Projeto criado com Claude Code → código funcionando localmente
- Código enviado para repositório no GitHub
- Repositório conectado à Vercel
- Vercel publica automaticamente a cada push
Uma vez configurado, você nunca mais precisa pensar em publicação. A Vercel cuida disso enquanto você foca no que importa: o conteúdo e as funcionalidades do seu site.