Como configurar o Zustand com Immer sem erros?

Links importantes para seu desenvolvimento 👇 • Continue assistindo as aulas gratuitas da Pós-graduação Tech Developer 360 https://rseat.in/ftr-aula-gratuita • Veja a nossa playlist de conteúdos de React para sua evolução    • Como criar o botão de Like perfeito com Re...   • Conheça a ementa do curso de Pós-graduação Tech Developer 360 da Faculdade de Tecnologia Rocketseat https://rseat.in/pos-tech-developer-360 Aprenda como usar Immer no React para trabalhar com imutabilidade de forma simples, segura e performática, integrando tudo isso ao Zustand para melhorar o gerenciamento de estado da sua aplicação. Neste vídeo, você vai entender por que o Immer elimina a necessidade de recriar objetos e arrays manualmente, permitindo escrever código mais limpo enquanto ele calcula automaticamente as mudanças imutáveis em segundo plano. Você também vai ver como configurar Immer dentro do Zustand, habilitar suporte a Map e Set, resolver erros de tipagem que surgiram em versões recentes e aplicar mutations muito mais diretas no estado. Além disso, veja como identificar e corrigir problemas comuns de reatividade e atualizações que não disparam renderização, garantindo um fluxo de estado previsível e mais fácil de manter. O que você vai aprender neste vídeo: • Como instalar e configurar Immer com Zustand. • Por que imutabilidade é essencial em React e gerenciamento de estado. • Como o Immer calcula alterações imutáveis automaticamente. • Como habilitar suporte a Map e Set no Immer. • Como corrigir problemas de tipagem gerados por updates recentes. • Como escrever mutations mais simples e diretas com Immer. • Como atualizar listas, objetos e estados complexos no Zustand sem retornar novos objetos manualmente. • Como garantir que o estado reativo atualize corretamente em todos os componentes. Dev, bora assistir na prática como resolver! Dá o play e vem conferir 👇 00:00 - 00:29 — Como instalar e iniciar com o Immer? 00:29 - 01:03 — Por que precisamos de imutabilidade no React/Zustand? 01:04 - 01:32 — Como o Immer calcula mudanças imutáveis automaticamente? 01:32 - 02:00 — Como preparar o Zustand para usar o Immer? 02:01 - 02:14 — Qual é a estrutura do `create` ao usar Immer? 02:16 - 02:26 — Como configurar o array de mutators? 02:26 - 02:41 — Como debugar erros na implementação? 02:42 - 02:59 — Quais ajustes no código e imports são necessários? 03:00 - 03:04 — Como conferir a documentação do Zustand + Immer? 03:05 - 03:15 — Como explorar exemplos oficiais? 03:16 - 03:53 — Como identificar bugs na implementação? 03:54 - 04:07 — Será que o problema está relacionado à tipagem? 04:13 - 04:26 — Como descobrir bugs na versão 5.0.2? 04:27 - 04:43 — O downgrade para 5.0.1 resolve o problema? 04:44 - 04:54 — Quais são as limitações do Immer com Map e Set? 04:54 - 05:02 — Como ativar suporte a Map e Set? 05:03 - 05:16 — Como o Immer permite mutações diretas? 05:16 - 05:21 — Como implementar `AddUpload` com Immer? 05:22 - 05:25 — Como fazer alterações sem `return`? 05:26 - 05:35 — Como modificar arrays e estado de forma direta? 05:35 - 05:40 — Como salvar e testar as alterações? 05:41 - 05:48 — Como testar a lista de uploads? 05:48 - 06:00 — Como conferir o funcionamento do estado? 06:00 - 06:09 — O mapa foi atualizado corretamente? 06:09 - 06:15 — O Immer está atualizando sem problemas? 06:16 - 06:27 — Quais componentes ainda precisam ser ajustados? 06:27 - 06:32 — Como checar o header? 06:32 - 06:37 — Como conferir o minimizer do botão? 06:37 - 06:43 — Como conferir titles e pendências? 06:43 - 06:55 — Quais ajustes são necessários no widget e item? 06:56 - 07:07 — Como encerrar e acessar aulas da pós-gradução da Rocketseat gratuita? ----- Conecte-se a 500mil devs e avance para o próximo nível com a nossa plataforma: https://rseat.in/rocketseat_ Cadastre-se na nossa plataforma: https://rseat.in/rocketseat_ Junte-se a mais de 392mil devs em nossa comunidade no Discord:   / discord   Acompanhe a Rocketseat nas redes sociais: TikTok: @rocketseat Facebook: @rocketseat Instagram: @rocketseat