Tirando o Projeto do Localhost: Como Publicar Sua Primeira Página Web Gratuitamente no GitHub Pages

Quem está nos primeiros semestres de Análise e Desenvolvimento de Sistemas (ADS) conhece bem essa rotina: criamos uma página HTML/CSS incrível, testamos no navegador (abrindo o arquivo direto da pasta ou pelo Live Server do VS Code) e tudo funciona perfeitamente.

Mas aí vem a pergunta: como enviar o link para amigos, professores ou colocar no portfólio?

Muitos estudantes acham que para colocar um site no ar é preciso contratar uma hospedagem paga ou dominar servidores complexos na nuvem. A boa notícia é que você pode publicar seus projetos de forma gratuita e em poucos minutos usando o GitHub Pages.

Neste artigo, vou mostrar o passo a passo direto para tirar o seu projeto do localhost e colocá-lo na internet.

🛠️ O que você precisa antes de começar?

• Uma página web simples (um arquivo index.html e suas pastas de CSS/JS/imagens).
• Uma conta gratuita no GitHub.
• O Git instalado no seu computador (ou usar a própria interface do site do GitHub).

⚠️ Regra de ouro: o arquivo principal da sua página precisa se chamar index.html. É ele que o servidor busca automaticamente para carregar o seu site.

📋 Passo a Passo Simplificado

1. Criar um repositório no GitHub

1. Acesse o GitHub e clique em New repository (Novo repositório).
2. Dê um nome ao seu projeto (ex: meu-primeiro-site).
3. Mantenha o repositório como Public (Público).
4. Clique em Create repository.

2. Subir os arquivos do seu projeto

Se você já usa Git pelo terminal, dentro da pasta do projeto:

git init
git add .
git commit -m "Primeiro commit do projeto"
git branch -M main
git remote add origin https://github.com/SEU-USUARIO/meu-primeiro-site.git
git push -u origin main

💡 Se for a primeira vez usando o Git na máquina, configure seu nome e e-mail antes do commit:

git config --global user.name "Seu Nome"
git config --global user.email "[e-mail]"

Além disso, o GitHub não aceita mais a senha da conta no git push. Use um Personal Access Token, o GitHub CLI ou uma chave SSH.

Se ainda não aprendeu os comandos do Git, você pode clicar em Add file → Upload files na página do repositório e arrastar os arquivos do projeto. Lembre-se de que o index.html deve ficar na raiz do repositório.

3. Ativar o GitHub Pages

Aqui é onde a mágica da publicação acontece:

1. No seu repositório, clique na aba Settings (Configurações).
2. No menu lateral esquerdo, vá até a seção Pages.
3. Em Build and deployment > Source, escolha Deploy from a branch.
4. Em Branch, selecione main e mantenha a pasta como / (root).
5. Clique em Save.

🎉 Pronto! Seu site está na nuvem

Geralmente em 1 a 2 minutos (às vezes um pouco mais), o GitHub processa os arquivos e gera um link público neste formato:

https://seu-usuario.github.io/meu-primeiro-site/

Agora qualquer pessoa no mundo consegue acessar a sua página pelo navegador do computador ou do celular!

ℹ️ O GitHub Pages é gratuito, mas tem limites de uso (por exemplo, tamanho do site e banda mensal) e é voltado a projetos pessoais, portfólios e documentação. Para a fase de estudos, é mais que suficiente.

💡 Por que isso é importante no início da faculdade?

• Portfólio real: em vez de guardar os trabalhos só no seu computador, você constrói um histórico de projetos visíveis.
• Entendimento de deploy: você começa a entender o conceito de deploy (publicação de código) e como o código da sua máquina chega ao usuário final.
• Integração com Git: você consolida o aprendizado de versionamento de código, um requisito básico para a maioria das vagas na área de tecnologia.

🎯 Próximos passos

Depois de dominar o GitHub Pages para sites estáticos (HTML/CSS/JS), o próximo passo nos estudos é explorar plataformas como Vercel ou Render para publicar projetos com backend e banco de dados.

E você, como publicou o seu primeiro projeto na web? Conte nos comentários! 👇