Projecto: um site pessoal, do zero até estar online

A Rita faz bolos por encomenda na Calheta e quer um endereço para dar às clientes, em vez de «procura-me no Facebook». Hoje fazes a tua página, do zero até estar online, com o que aprendeste neste nível.

Antes de começar: o que é «pronto»

Escreve os critérios antes; sem eles nunca sabes se acabaste. Está pronto quando:

1. existe uma pasta nova com Git;
2. o agente criou uma página tua (nome, o que fazes, contacto fictício) em HTML e CSS;
3. reviste o diff e abriste a página no browser;
4. fizeste commit;
5. existe um repositório teu no GitHub com estes ficheiros;
6. a página está publicada com o GitHub Pages;
7. abriste-a no telemóvel;
8. pediste uma mudança ao agente e voltaste a publicar.

Isto é como está a 6 de Outubro de 2026; se o ecrã for diferente, procura o botão com o mesmo nome. Guia oficial: Guia rápido do GitHub Pages.

Passo 1: a pasta e o Git

mkdir site-pessoal
cd site-pessoal
git init

Se não deu: se o git init disser que não conhece o comando, volta à lição 5.

Passo 2: o agente faz a página

Abre o agente dentro da pasta site-pessoal e troca os dados pelos teus:

Cria nesta pasta uma página pessoal simples, em dois ficheiros: index.html e estilo.css.
Conteúdo: o meu nome (Maria Silva), uma frase sobre o que faço (bolos por encomenda na Calheta) e o contacto maria@example.com.
Português europeu, letra grande e legível, e que fique bem no telemóvel.
Sem bibliotecas nem ficheiros de fora. Antes de criar, mostra-me o plano.

Se quiseres, começa por um AGENTS.md curto, como na lição anterior.

Se não deu: o index.html tem de ficar na pasta principal, não numa subpasta, e o nome tem de ser exactamente index.html, em minúsculas. Se não estiver, pede ao agente para o mudar.

Passo 3: rever e abrir no browser

Ficheiros novos ainda não aparecem no git diff. Junta-os primeiro e vê o que entra:

git add .
git diff --staged

Depois abre o index.html com dois cliques, ou arrasta-o para o browser.

Se não deu: se a página aparece sem cores nem arrumação, o index.html não está a encontrar o estilo.css. Pede ao agente: «A página abre sem estilo. Verifica a ligação ao estilo.css.»

Passo 4: commit

git commit -m "Primeira versão do site pessoal"

Se não deu: «Author identity unknown» quer dizer que falta o git config com nome e email, da lição 5.

Passo 5: o repositório no GitHub

No GitHub, carrega no + no canto superior direito e escolhe New repository. O nome tem de ser UTILIZADOR.github.io, com o teu nome de utilizador. Escolhe Public e deixa o README desligado (ao contrário do guia rápido, tu já tens os ficheiros). Carrega em Create repository.

Depois, no terminal, troca UTILIZADOR pelo teu nome de utilizador nas duas vezes em que aparece:

git remote add origin https://github.com/UTILIZADOR/UTILIZADOR.github.io.git
git branch -M main
git push -u origin main

Na primeira vez o Git pede-te para entrar no GitHub, quase sempre numa janela do browser. Guia: adicionar código local ao GitHub.

Se não deu:

• «Password authentication is not supported»: a palavra-passe normal do GitHub não serve no terminal. Instala a ferramenta oficial GitHub CLI, corre gh auth login e escolhe HTTPS. Guia: guardar as credenciais do GitHub no Git.
• «Repository not found»: o nome do repositório ou o UTILIZADOR não batem certo.
• «rejected»: o repositório foi criado com README. Pede ao agente que te explique as opções antes de fazer seja o que for.
• Sem terminal: no repositório, em Add file, escolhe Upload files e arrasta os dois ficheiros. Escolhe pôr o commit directamente no main e carrega em Commit changes. Se escolheres um ramo novo, o botão passa a Propose changes e abre um pedido de alteração (pull request): o site só muda depois de Merge pull request. Guia: adicionar um ficheiro a um repositório.

Passo 6: publicar com o GitHub Pages

No repositório, abre Settings. Na barra lateral, na secção «Code, planning, and automation», escolhe Pages. Em «Build and deployment», no campo «Source», escolhe Deploy from a branch. No campo «Branch», escolhe main e a pasta / (root). Carrega em Save.

O site fica em https://UTILIZADOR.github.io. Pode levar até 10 minutos a aparecer.

Com uma conta gratuita, o GitHub Pages só publica repositórios públicos. Serve para páginas pessoais, não para uma loja online nem para recolher palavras-passe ou dados de cartões.

Alternativa sem conta: o Netlify Drop, onde arrastas a pasta para o browser; um site publicado sem conta tem condições, por isso lê-as primeiro nessa página.

Se não deu: se aparecer «404», espera os 10 minutos. Se continuar, confirma o nome do repositório e que o index.html está na pasta principal.

Passo 7: no telemóvel

Abre o browser do telemóvel e escreve o endereço, com https:// no início.

Se não deu: se a letra estiver minúscula, pede ao agente que a torne legível em ecrãs pequenos e volta a publicar, como no passo 8.

O que levas deste nível

• Usar um agente de código numa pasta tua, ler o diff e desfazer quando corre mal.
• Guardar versões com Git e uma cópia no GitHub.
• Manter segredos fora do Git, com regras para o agente e um tecto ao gasto.
• Dar contexto com o CLAUDE.md ou o AGENTS.md e pôr uma página online.

A seguir: Nível 2

O Nível 2 trata de pedir bem e testar, comandos, skills e hooks, MCP, injecção de instruções, contexto, memória, subagentes, custos e ramos do Git. Fecha com um projecto maior: uma API com base de dados, testes e publicação.