Módulo 20: Conclusão e Projeto Final

2. Resumo da Aula Anterior

Passaste por 19 módulos intensos! Desde as primeiras tags <html> até à auditoria de performance com o Lighthouse. Agora é o momento de coroar todo este esforço.

3. O Que Vais Aprender Hoje

✅ Como estruturar o teu Projeto Final.
✅ Criar uma navegação entre múltiplas páginas.
✅ Dicas para um Portfólio que impressiona empresas.
✅ O caminho para te tornares um Full-Stack Developer.

4. Teoria: O Grande Arquiteto

Conceito: Um programador sénior não é aquele que sabe todas as tags de cor, mas sim aquele que sabe como as peças se encaixam para criar um sistema útil e bonito. O projeto final é o teu test-drive como arquiteto web.

🏗️ Analogia: A Construção do Prédio

Durante o curso, aprendeste a fazer tijolos, a pintar paredes e a instalar luzes:

Os Módulos: Foram as ferramentas e os materiais.
O Projeto Final: É o prédio concluído. É quando convidas os teus "clientes" (utilizadores) para entrar e ver como tudo funciona em conjunto.
O Certificado: É a licença de utilização. Diz ao mundo: "Eu sei construir na Web!"

5. Exemplos Práticos

Exemplo 1: Navegação Multi-página

O segredo de um site real.

<!-- No index.html -->
<nav>
  <a href="index.html" class="active">Home</a>
  <a href="projetos.html">Projetos</a>
  <a href="contacto.html">Contacto</a>
</nav>

Garante que o menu é igual em todas as páginas para não confundir o utilizador.

Exemplo 2: Footer Profissional

Onde o utilizador encontra os teus links finais.

<footer>
  <p>© 2025 O Teu Nome. Todos os direitos reservados.</p>
  <div class="social">
    <a href="https://linkedin.com/...">LinkedIn</a>
    <a href="https://github.com/...">GitHub</a>
  </div>
</footer>

O footer dá credibilidade e termina a experiência do utilizador com elegância.

Exemplo 3: O Teu Portfólio (Mockup)

Visualiza o teu sucesso.

Projeto: Agência de Viagens

HTML5 Semântico, CSS Grid e Flexbox.

Projeto: Currículo Online

Otimizado para SEO e Acessibilidade.

6. O Teu Último Desafio!

Vamos fechar com chave de ouro:

Escolhe um tema (ex: Restaurante, Loja de Animais ou o teu Portfólio).
Cria pelo menos 3 páginas ligadas entre si.
Usa CSS Flexbox ou Grid para o layout.
Garante que o site passa no W3C Validator com 0 erros.
Tira um print do teu score 100 no Lighthouse!

7. Prova de Fogo Final

Carregando quiz...

8. Resumo da Jornada

📌 Não tenhas medo de errar, o F12 está lá para te ajudar.
📌 O HTML5 é a base de tudo, mas o design (CSS) é o que vende.
📌 Um bom programador é um eterno estudante.
📌 O teu GitHub é agora o teu currículo mais valioso.

9. Próximos Passos

Caminho 1: Especialista em Visual

Estuda SASS, Tailwind CSS e Framer Motion para criar animações incríveis.

Caminho 2: O Cérebro (JavaScript)

Aprofunda os teus conhecimentos de JS Vanilla e depois salta para o React ou Next.js.

Caminho 3: Backend

Aprende como ligar os teus sites a bases de dados reais com Node.js ou Python.

Aprende Web