Solucionado (ver solução)
Solucionado
(ver solução)
2
respostas

[Dúvida] Hook useReducer

Prezados,

Boa tarde tudo bem?

Falamos bastante sobre requisições http, e no decorrer da carreira em React falamos sobre vários hooks importantes, no entanto não houveram comentários sobre o hook useReducer. Gostaria de saber se este hook deixou de ser praticado ou se ainda é uma opção no mercado atual. Desculpe a pergunta mas eu particularmente gosto de ser bem metódico com o desenvolvimento e gostei muito do comportamento do useReducer, uma vez que nos permite separar bem a lógica de telas mais complexas.

Grato

2 respostas
solução!

Faaaala, Wesley! Bão demais?

A gente tem esse vídeo aqui focado no. useReducer — e pode ficar tranquilo que ele ainda não morreu, não. Ainda é uma opção totalmente válida e, na real, continua sendo a escolha certa em alguns cenários específicos.

O que acontece é que o useReducer brilha quando você tem estados mais complexos, com múltiplas transições possíveis ou quando uma ação precisa atualizar várias partes do estado de uma vez. Sabe aquela tela de checkout com vários passos, validações, estados de loading diferentes? É aí que ele mostra seu valor. Alguns casos de uso interessantes:

  1. Estados complexos ou com muitas transições

Se o estado:

  • tem múltiplos campos relacionados
  • muda de formas diferentes dependendo da ação
  • segue regras claras (quase como uma state machine)

useReducer deixa isso mais previsível do que vários useState.

  1. Quando você quer separar “o que aconteceu” de “como o estado muda”

Com useReducer você trabalha com ações, não com setters diretos.

Isso ajuda quando:

  • a lógica de atualização começa a crescer
  • você quer facilitar testes
  • você quer ler o código e entender a intenção

Por que isso:

dispatch({ type: 'ADD_ITEM', payload: item })

é mais expressivo do que:

setItems([...items, item])

em contextos complexos.

Agora, na prática do mercado, o que a gente vê é que muita gente acabou migrando pra libs de gerenciamento de estado (Zustand, Jotai, Redux Toolkit) que já resolvem esse problema de organização de forma mais "plug and play". Então o useReducer puro acaba aparecendo menos em projetos novos, mas não porque ele seja ruim — é mais porque essas libs abstraem o mesmo padrão.

Outro ponto importante: quando a gente fala de estado relacionado a requisições HTTP (loading, erro, dados, cache), o React Query (TanStack Query) dominou esse espaço. Ele cuida de todo aquele estado que antes a gente gerenciava na mão — isLoading, isError, data, refetch — e ainda entrega cache, invalidação, retry automático... É uma mão na roda. Então muito do estado que antes precisava de um useReducer pra organizar, hoje o React Query já resolve de forma muito mais elegante.

Inclusive também temos dois cursos incríveis com a Patrícia sobre isso:

Agora, se você for olhar por baixo do capô, o Redux e várias outras libs usam exatamente esse conceito de dispatch + action + reducer. Então entender bem o useReducer te dá uma base sólida pra qualquer uma dessas ferramentas.

Grande abraço, bons estudos e que a força esteja com você.

Bom dia Vinicius,

Muitíssimo obrigado por dispor um pouco do seu tempo para me responder e com um conteúdo muito enriquecedor, já assisti o vídeo indicado por você aqui, e também me inscrevi no primeiro curso sobre React Query. Como estou direcionando meus estudos com o objetivo de criar uma aplicação a qual idealizei, e por se tratar de uma aplicação complexa, o vídeo só confirmou mais uma vez que o useReducer talvez seja uma opção a qual eu vou usar mais que o useState. Já tive umas ideias aqui e acho que pode ser uma ferramente extremamente poderosa e organiza se utilizada junto do Context do React, ou eu migro totalmente para o Redux (Ainda não sei).
Mas já deixou bem claro para mim o que eu queria, mais uma vez muito obrigado!