Pular para conteúdo

Exercícios de Fixação – Aula 07 🗺️

Exercício 01: Setup das Rotas

Crie um projeto novo e configure o BrowserRouter. 1. Crie duas rotas: / (Home) e /contato (Contato). 2. Crie um componente de Navegação com <Link> para ambas. 3. Certifique-se de que a mudança de URL não recarrega a página.

Exercício 02: Rota 404 (Not Found)

Adicione uma rota coringa (path="*") que exiba uma mensagem amigável: "Ops! Essa página não existe. [Voltar para Home]". Teste digitando uma URL inexistente no navegador.

Use o <NavLink> no seu menu de navegação. 1. Crie uma classe CSS chamada .active no seu App.css. 2. Essa classe deve deixar o link em negrito e com uma cor de destaque quando for a página atual.


🟡 Nível: Intermediário

Exercício 04: Redirecionamento Programático

Crie um formulário simples na página de Contato. 1. Use o hook useNavigate. 2. Após o usuário clicar em "Enviar", simule um envio e use o navigate("/") para mandá-lo de volta para a Home automaticamente.