Dicas de state management para React

Prompt gerado automaticamente para State management em React

5.0
34 usos
ChatGPT
Usar no ChatGPT
"Você é um engenheiro de software sênior com vasta experiência em desenvolvimento front-end, focado em React. Sua tarefa é criar um guia prático e conciso para desenvolvedores juniores que estão migrando de aplicações React com `useState` para gerenciamento de estado global com Redux Toolkit Query (RTK Query) para chamadas assíncronas de API e Zustand para estado local/global síncrono. O guia deve abordar os seguintes pontos, de forma clara e didática, incluindo exemplos de código simples e comparativos:

1.  **Contexto e Motivação:** Por que e quando considerar a migração de `useState` para soluções de gerenciamento de estado mais robustas (RTK Query/Zustand)? Quais os problemas que eles resolvem em aplicações maiores?
2.  **RTK Query:**
    *   Explicação do conceito de "data fetching e caching" automatizado.
    *   Como definir um `apiSlice` básico (ex: para uma lista de produtos).
    *   Como usar `useQuery` para buscar dados e `useMutation` para enviar dados (ex: adicionar um produto).
    *   Benefícios em termos de boilerplate, performance e UX.
3.  **Zustand:**
    *   Explicação do conceito de "stores" leves e flexíveis.
    *   Como criar uma store simples (ex: para gerenciar o tema da aplicação ou um estado de formulário complexo).
    *   Como consumir e atualizar o estado da store em componentes.
    *   Vantagens sobre Redux "clássico" para certos cenários.
4.  **Integração e Coexistência:**
    *   Como RTK Query e Zustand podem coexistir harmoniosamente na mesma aplicação.
    *   Quando usar RTK Query vs. quando usar Zustand para um determinado tipo de estado.
    *   Exemplo de um componente que utiliza dados de RTK Query e gerencia um estado de UI local/global com Zustand.
5.  **Boas Práticas e Dicas:**
    *   Organização de stores e slices.
    *   Testabilidade.
    *   Considerações sobre performance.

O tom deve ser profissional, porém acessível, e o guia deve ser prático o suficiente para que um desenvolvedor júnior possa começar a aplicar

Como Usar este Prompt

1

Clique no botão "Copiar Prompt" para copiar o conteúdo completo.

2

Abra sua ferramenta de IA de preferência (ChatGPT e etc.).

3

Cole o prompt e substitua as variáveis (se houver) com suas informações.

Compartilhe

Gostou deste prompt? Ajude outras pessoas a encontrá-lo!

Outros prompts de React

Continue explorando prompts nesta categoria.

Melhores práticas de server-side rendering para React

Prompt gerado automaticamente para Server-side rendering em React

Melhores práticas de error boundaries para React

Prompt gerado automaticamente para Error boundaries em React

Melhores práticas de performance optimization para React

Prompt gerado automaticamente para Performance optimization em React