Você criou um site com o Claude Code, ele funciona no seu computador, mas ninguém mais consegue ver. E agora?
Neste tutorial você vai aprender a publicar site do Claude Code num domínio de verdade, usando GitHub e a hospedagem da Hostinger.
O passo a passo é baseado no vídeo do canal MeticsMedia sobre o tema, reescrito aqui com as dicas que mais importam para quem está começando.
O que você precisa para publicar site do Claude Code
Hospedagem é um servidor que fica ligado 24 horas para que seu site abra de qualquer lugar, mesmo com o seu computador desligado.
No vídeo, o apresentador usa a Hostinger porque ela detecta sozinha o framework do projeto (Vite, Next.js ou React, por exemplo) e reúne domínio, e-mail, banco de dados e SSL num só plano.
Antes de contratar, vale saber quatro pontos que o vídeo destaca sobre o plano:
- Para um site em JavaScript com Node.js, o plano de entrada (Premium) não serve. É preciso o plano do meio, chamado Unlimited na época da gravação.
- Cada conta permite até cinco aplicativos Node.js. Passou disso, o vídeo indica o plano Cloud Startup.
- Projetos com backend em Python (Flask, Django, FastAPI) não rodam nos planos gerenciados. Para eles, o caminho é uma VPS.
- Pagando 12 meses ou mais, você ganha um domínio grátis por um ano. No plano mensal, o vídeo cita US$ 18,99 por mês e nada de domínio grátis.
Preços e nomes de plano mudam com frequência. Confira a página oficial da Hostinger no dia da compra.
As 3 checagens antes de publicar
Essa etapa evita dor de cabeça depois. Faça as três com o Claude Code aberto na pasta do seu projeto.
Pergunte: “Este projeto é um site estático (HTML, CSS e JavaScript) ou um app de framework? Se for framework, qual é, e ele roda em Node.js?”
Se ele não funciona localmente, o deploy não vai consertar. Abra o site e clique pelas páginas.
Peça ao Claude para conferir se o Git está instalado, procurar chaves de API expostas (o arquivo .env precisa estar no .gitignore) e rodar o build de produção corrigindo erros.
O arquivo .env guarda senhas e chaves de API fora do código. Assim, você envia o código ao GitHub sem enviar os segredos junto.
| Resultado da checagem 1 | O que fazer |
|---|---|
| Site estático | Siga este tutorial normalmente. |
| Next.js | Melhor cenário, é o exemplo do vídeo. |
| React, Vue, Angular, Vite, Svelte, Astro ou Express | Compatível, mas pode exigir pequenos ajustes no deploy. |
| Python (Flask, Django, FastAPI) | Este tutorial não serve. Use uma VPS. |
Envie o projeto para o GitHub
Você não precisa subir arquivos na mão. O Claude Code cria o repositório e envia o projeto por você.
Só é preciso ter uma conta gratuita no GitHub. Depois, peça algo como:
Crie um repositório privado no GitHub para este projeto e envie o código. Adicione um .gitignore que proteja meu .env e qualquer chave de API. Se minha conta não estiver autenticada, me guie na conexão.
Na primeira vez, o GitHub pede uma autorização. O Claude vai indicar um comando, normalmente gh auth login, para você rodar no terminal.
Escolha GitHub.com, o protocolo HTTPS e o login pelo navegador. Copie o código de uso único, autorize e volte ao Claude para pedir que tente o envio de novo.
Depois, abra o repositório no navegador e confirme que os arquivos chegaram e que nenhuma chave aparece por lá.
Conecte o repositório à Hostinger
No painel da Hostinger, escolha “Criar um novo site” e, na seção de usuários avançados, a opção Node.js Web App.
Registre um novo (grátis no primeiro ano com plano anual) ou conecte um que você já tenha. Nesse caso, a Hostinger mostra os DNS para configurar no seu registrador.
Na tela “Deploy Your Web App”, use “Connect with GitHub”, autorize a Hostinger e selecione o repositório.
Na tela de build, veja se o preset detectado bate com o do seu projeto. Se você seguiu a checagem 1, já sabe qual deve aparecer.
Use o botão Import .env para subir todas as chaves de uma vez. O arquivo começa com ponto e fica oculto: no Mac, use Command + Shift + ponto no seletor; no Windows, ative “Itens ocultos” no menu Exibir.
A Hostinger monta o projeto e publica. Leva alguns minutos e, no fim, mostra uma prévia do site pronto.
Uma regra importante sobre banco de dados: só cole no projeto a chave pública, própria para o front-end. A chave de administrador (chamada de secret ou service_role) nunca deve ir para o site.
O que fazer quando o deploy falha
Falha no primeiro deploy é normal. Existem dois formatos de problema, e cada um tem seu lugar para investigar.
- O build falha: a Hostinger mostra o status “Failed” em vermelho. Abra os logs de build, copie tudo e entregue ao Claude.
- O build termina, mas o site não abre: o problema está na execução. No gerenciador de arquivos, abra a pasta nodejs e leia o arquivo stderr.log. Cole o conteúdo no Claude e peça para diagnosticar, corrigir e enviar de novo.
Se o mesmo tipo de erro voltar depois de duas ou três tentativas, o vídeo sugere converter o projeto para Next.js, mantendo as mesmas funções.
Outro cuidado: não basta a página inicial abrir. Teste no site publicado tudo o que ele faz, como formulários, recursos de IA e cadastros.
Atualize o site com um único prompt
Essa é a grande vantagem de passar pelo GitHub. Toda mudança enviada para lá é publicada automaticamente pela Hostinger.
O fluxo é simples: peça a alteração ao Claude, depois peça “faça o commit e envie para o GitHub”. Em cerca de dois a três minutos, a mudança está no ar.
Se a alteração não aparecer, pode ser cache do navegador. Abra o site numa janela anônima ou limpe o cache.
O GitHub também funciona como um botão de desfazer: dá para pedir ao Claude para voltar o site a um commit anterior, e a Hostinger publica essa versão de novo.
Perguntas frequentes
Preciso saber programar para publicar um site com o Claude Code?
Algum conhecimento básico ajuda bastante, principalmente para entender mensagens de erro e checar o que a IA gerou. Você não precisa dominar uma linguagem para começar, mas deve conseguir seguir as instruções com atenção e revisar cada mudança antes de aceitá-la.
O que fazer se o deploy falhar?
Leia com calma a mensagem do log, que costuma apontar o arquivo ou a variável com problema. Depois, peça à IA para explicar o erro e corrigir apenas essa parte, sem reescrever o projeto inteiro. Testar a mudança localmente antes de enviar outra versão evita um ciclo longo de tentativas.
Posso guardar senhas e chaves de acesso no código?
Não é recomendado. Chaves de API e senhas devem ficar em variáveis de ambiente configuradas no painel da hospedagem, e nunca dentro dos arquivos que vão para o GitHub. Um repositório público exposto pode permitir que terceiros usem essas credenciais.
Como atualizar o site depois que ele estiver no ar?
A forma mais segura é fazer a alteração no projeto, testar e enviar a nova versão ao GitHub. Com a integração configurada, a hospedagem publica a atualização automaticamente. Evite editar arquivos direto no servidor, porque essas mudanças podem ser perdidas no próximo envio.
Conclusão
Publicar um projeto do Claude Code se resume a cinco etapas: checar o projeto, enviar ao GitHub, conectar à Hostinger, configurar as variáveis e testar o site no ar.
Quer ver outro projeto feito com o mesmo assistente? Leia nosso guia sobre como criar uma loja Shopify com o Claude Code.