Exercícios de Fixação – Aula 09 🌐
Exercício 01: Criando um Contexto de Tema
- Crie um arquivo
ThemeContext.js. - Configure um contexto que guarde o valor
'light'ou'dark'. - Use o
Providerpara envolver sua aplicação.
Exercício 02: Consumindo o Tema
Crie um componente Cabecalho que use o hook useContext para ler o tema atual e mudar a cor de fundo do header (ex: preto para dark, branco para light).
🟡 Nível: Intermediário
Exercício 03: Alterando o Contexto
Adicione uma função toggleTheme ao seu contexto. No componente Configuracoes, crie um botão que, ao ser clicado, alterna o tema globalmente. Observe como todos os componentes que usam o contexto mudam de cor ao mesmo tempo.
Exercício 04: Contexto de Autenticação (Simulado)
- Crie um
AuthContextque guarde um objetousuario(inicialmentenull). - Crie uma função
loginque define um objeto{ nome: 'Admin', logado: true }. - Na Navbar, mostre "Bem-vindo, Admin" se houver usuário, ou um botão "Entrar" se estiver null.