Módulo 08 2 semanas

08 - Projeto Integrador e Publicação

Este módulo serve para juntar tudo: estrutura, estilo, comportamento, organização e entrega. Aqui a pessoa deixa de apenas reproduzir exercícios e passa a construir um projeto mais completo.

Objetivos do módulo

• Consolidar HTML, CSS, JavaScript, Git e GitHub.
• Planejar um projeto do início ao fim.
• Publicar uma entrega final utilizável.
• Criar material que já possa entrar em portfólio.

Fontes para revisão

• Curso HTML5 e CSS3 - repositório oficial
• Curso de JavaScript - repositório oficial
• Curso de Git e GitHub - repositório oficial
• Introdução à Web - MDN

Projeto recomendado

Recomendado: Portfólio Pessoal de Iniciante

Crie um site com:

• página inicial
• seção “sobre mim”
• seção “habilidades em aprendizado”
• seção “projetos”
• formulário de contato simples
• layout responsivo
• interações leves com JavaScript

Outras opções de projeto

• Landing page de serviço local
• Lista de tarefas com persistência
• Organizador de estudos
• Página de catálogo simples

Requisitos mínimos do projeto

• HTML semântico
• CSS organizado
• responsividade básica
• JavaScript para pelo menos uma interação real
• uso de Git durante o desenvolvimento
• publicação no GitHub

Passo a passo sugerido

1. Defina o objetivo do projeto em uma frase.
2. Liste quais seções a interface terá.
3. Desenhe um rascunho em papel.
4. Monte primeiro o HTML.
5. Aplique o CSS em camadas: estrutura, tipografia, cores, layout e responsividade.
6. Adicione o JavaScript só depois que a estrutura e o visual estiverem estáveis.
7. Versione o projeto desde cedo.
8. Publique e teste.

Interações possíveis com JavaScript

• menu mobile
• validação de formulário
• filtro de projetos
• botão de trocar tema
• contador
• mensagens de feedback

Critérios de avaliação simples

Use esta régua:

• Estrutura: o HTML está organizado e faz sentido?
• Visual: a interface está legível e consistente?
• Responsividade: funciona minimamente em celular?
• Interação: o JavaScript resolve algo útil?
• Organização: os arquivos estão nomeados e separados com clareza?
• Entrega: está publicado e acessível?

Entrega final esperada

• link do repositório
• link publicado
• README.md com descrição do projeto
• lista do que foi aprendido durante a construção

Checklist de conclusão

• Planejei um projeto antes de sair codando.
• Usei HTML, CSS e JavaScript em conjunto.
• Versionei o processo com Git.
• Publiquei o resultado final.
• Tenho pelo menos um projeto que posso mostrar a outras pessoas.