Pular para o conteúdo
IA-OS // subir-na-web
Curso de Introdução · Guia 3 de 3Colocar seu sistema na internet

ETAPA 6 DE 9 15 MIN

Publicar na Vercel

Importar o repositório e publicar, com endereço e cadeado.

Seu computadorMeu computador é

Agora a Vercel pega o seu código do GitHub e coloca no ar. Esta etapa segue o guia oficial da Vercel (Getting started) e só acrescenta o que protege: a Vercel vê só o repositório deste sistema, e você não muda nenhuma configuração.

Quais repositórios a Vercel pode ver

Na hora de ligar a Vercel ao GitHub, o GitHub pergunta se ela pode ver todos os seus repositórios ou só alguns.

Só o repositório deste sistemaRECOMENDADO

PONTOS FORTES

  • Se um dia a conta da Vercel for invadida, o estrago fica num repositório só.
  • Você sabe exatamente o que está ligado a quê.

PONTOS FRACOS

  • Para publicar outro sistema, você volta ao GitHub e acrescenta o repositório novo na lista.

Todos os repositórios

PONTOS FORTES

  • Qualquer repositório novo já aparece na Vercel, sem passo extra.

PONTOS FRACOS

  • A Vercel passa a ler todo o seu código, inclusive o que nunca vai ser publicado.
  • Uma conta invadida expõe tudo de uma vez.

Importar o repositório

  1. No painel da Vercel, clique em New Project (no alto, à direita; às vezes aparece como Add New… e depois Project), ou abra vercel.com/new.
  2. Em Import Git Repository, a Vercel pede para instalar o aplicativo dela no GitHub. Clique em Install (ou em Adjust GitHub App Permissions, se ela já mostrar uma lista).
  3. No GitHub, em Repository access, escolha Only select repositories, selecione meu-primeiro-sistema e clique em Install (ou Save).
  4. De volta à Vercel, o meu-primeiro-sistema aparece na lista. Clique em Import ao lado dele.

Publicar sem mexer em nada

A Vercel mostra a tela de configuração: nome do projeto, Framework Preset, pastas e Environment Variables. Confira só duas coisas:

  • Framework Preset diz Next.js. A Vercel descobre sozinha.
  • Environment Variables fica vazio. A demo não precisa de nenhuma variável: o endereço que a Vercel dá já é aceito.

Não mude mais nada e clique em Deploy. A Vercel monta o sistema (leva um ou dois minutos) e mostra uma tela de parabéns com a imagem do seu site.

Clique em Continue to Dashboard. Em Domains aparece o seu endereço, algo como meu-primeiro-sistema.vercel.app (se esse nome já tiver dono, a Vercel acrescenta letras no fim). Abra no navegador: ele começa com https://, tem cadeado e mostra Você conseguiu! e Seu sistema está no ar, na internet, com cadeado.

Conferir de fora

No terminal, dentro da pasta meu-primeiro-sistema, rode o comando abaixo trocando o endereço pelo seu:

Não deu certo? Veja o que fazer
  • A Vercel pediu para confirmar um número de celular: é a verificação de conta nova contra robôs. Confirme com o código que chega por SMS e continue.
  • O repositório não aparece na lista da Vercel: o aplicativo da Vercel não tem acesso a ele. Clique em Adjust GitHub App Permissions, acrescente meu-primeiro-sistema em Only select repositories e salve.
  • A publicação falhou (Build Failed): no seu computador, rode npm run build dentro da pasta. Se der erro lá também, mostre ao Claude: "O npm run build deu este erro: (cole aqui)". Se no seu computador funcionar, copie o fim do registro da Vercel e mostre ao Claude do mesmo jeito.
  • A página diz que a demo só responde no seu computador (erro 403): a v2 não chegou ao GitHub. Volte à etapa Atualizar a demo, depois rode git push e espere a Vercel publicar de novo.
  • O npm run no-ar mostra [FALTA] no cadeado: confira se o endereço começa com https:// e se é o mesmo que aparece em Domains.

Travou nesta etapa? Me conta o que aconteceu.

ESTE GUIA FAZ PARTE DE UM CURSO

Curso de Introdução

Três guias, na ordem, para sair do zero e ter o seu próprio sistema funcionando com a ajuda do Claude. Não precisa saber programar.

Este é o guia 3 de 3.

Ver o curso completo →