Inglês
Espanhol
No universo do React, temos diversas libs, Context API e o próprio useState, que são uma mão na roda na hora de gerenciarmos o estado no React.
Porém existem algumas libs como Jotai e Recoil que têm uma abordagem diferente. Nelas é possível gerenciar o estado de uma forma simples através de átomos, facilitando o acesso e composição de estados (nesse casso de átomos).
Motivos para usar Jotai ou Recoil
- Facilidade em acessar e modificar um estado que pode ser global ou não;
- Flexibilidade para combinar estados(átomos);
- Minimalismo e adaptação com as novas features do React (Ex: Suspense);
- Integração com Redux DevTools, porém com a limitação de debugar um átomo por vez.
Utilizando Jotai
Preferi nesses exemplos utilizar o Jotai, pois ele tem uma implementação mais simplista que o Recoil.dd the necessary resource in the time and stage that requires it.
Instalando
No projeto em react basta adicionar o pacote do Jotai (a lib já está implementada em TypeScript).
yarn add jotai react
EXEMPLOS
Utilizando e compondo átomos
Neste exemplo vemos um contador e também de como podemos fazer uma composição entre átomos na função addMoreFive.
Derived Async Atoms
Também podemos criar átomos que quando invocados executam funções assíncronas, átomos que tem esse tipo de implementação são chamados de Derived Async Atoms.
Compartilhando o estado entre componentes
No exemplo abaixo podemos ver o quão fácil é compartilhar e alterar um átomo entre diversos componentes.
Autor: Dennis Kaffer
Sobre: Dennis programa há mais de dez anos e atua como desenvolvedor no mercado de trabalho há 8 anos.
Atualmente está focado em front-end, mas gosta de quase tudo que envolva programação.
