← Voltar ao Material de Estudo
Exercícios Práticos

Exercícios — Programação

Prática para HTML/CSS, JavaScript, APIs e SQL. Faz por níveis: básico → intermédio → avançado.

● Básico ● Intermédio ● Avançado

HTML + CSS

  • 01
    Landing page Básico Cria uma página com header fixo, hero, 3 secções e footer. Foca na estrutura semântica e responsividade.
  • 02
    Cards responsivos Intermédio 8 cards em grid com breakpoints: 4 colunas → 2 → 1. Usa grid-template-columns e media queries.
  • 03
    Formulário com validação Intermédio Validações visuais de erro/sucesso com :invalid, :valid e layout acessível com labels e aria.
  • 04
    Clone UI Avançado Recria o layout de uma página real (apenas HTML/CSS). Analisa margin, padding, flex/grid e tipografia.

JavaScript

  • 05
    To-do list Básico Adicionar, editar e remover tarefas. Guardar estado em localStorage para persistência entre sessões.
  • 06
    Filtro + pesquisa Intermédio Lista de itens com filtro por categoria e pesquisa por texto em tempo real com input events.
  • 07
    Consumo de API Intermédio Usa fetch para chamar uma API pública. Gere estados: loading, erro, sucesso e retry automático.
  • 08
    Autenticação com token Avançado Guarda token em localStorage, protege páginas com redirect se não autenticado e faz logout correto.

SQL + MySQL

  • 09
    CRUD básico Básico Escreve queries para criar, listar, atualizar e apagar projetos. Pratica INSERT, SELECT, UPDATE, DELETE.
  • 10
    JOIN entre tabelas Intermédio Cria tabela comments e lista comentários com o nome do projeto usando INNER JOIN.
  • 11
    Índices e performance Avançado Testa performance com e sem índice em colunas de pesquisa usando EXPLAIN e CREATE INDEX.
  • 12
    Diagrama ER Avançado Desenha o diagrama entidade-relação do sistema completo. Identifica chaves primárias, estrangeiras e cardinalidades.

API / Back-end (Node.js)

  • 13
    Validação de inputs Básico Valida body, query e params nas rotas e devolve erros consistentes com status code correto.
  • 14
    Paginação Intermédio Adiciona ?page= e ?limit= às listagens. Devolve total, page e hasNext na resposta.
  • 15
    Upload de ficheiros Intermédio Valida tipo MIME e tamanho de ficheiros (imagens/vídeos). Usa multer com filtros de segurança.
  • 16
    Logs de requests Avançado Regista método, rota, status e tempo de resposta de cada pedido. Implementa middleware de logging.