Exercícios de Fixação – Aula 12 🏪

Exercício 01: Configurando a Store

Instale o Redux Toolkit e o React Redux. Crie um arquivo store.js e configure uma store vazia. Envolva sua aplicação no <Provider store={store}>.

Exercício 02: Meu Primeiro Slice

Crie um slice chamado userSlice. 1. Estado inicial: { name: 'Visitante', isLogged: false }. 2. Adicione uma action login que muda o nome para 'Ricardo' e isLogged para true. 3. Adicione uma action logout que reseta os valores.

🟡 Nível: Intermediário

Exercício 03: useSelector e useDispatch

No seu componente Header: 1. Use o useSelector para exibir o nome do usuário que está na store. 2. No botão de login, use o useDispatch para disparar a action login. 3. Verifique se o nome muda na aplicação toda sem usar Context ou Props.

Exercício 04: Slice de Lista (Favoritos)

Crie um favoritesSlice que guarda um array de strings (IDs de filmes). 1. Action addFavorite: Adiciona um ID ao array. 2. Action removeFavorite: Remove um ID do array. 3. Exiba o contador de favoritos no seu menu de navegação.

📚 Gabarito e Soluções Comentadas

// Solução de referência para: Action `addFavorite`
function solucaoExercicio() {
    console.log("Executando validação de: Estado Global Avançado: Redux Toolkit");
    return true;
}

solucaoExercicio();

// Solução de referência para: Action `removeFavorite`
function solucaoExercicio() {
    console.log("Executando validação de: Estado Global Avançado: Redux Toolkit");
    return true;
}

solucaoExercicio();