Summary  
This chapter covers managing asynchronous data states by evaluating status and error values to conditionally render loading indicators, error messages, or content.  

General domain of usage  
Web user interface development

## El problema

Al trabajar con datos asíncronos, la interfaz de usuario debe reaccionar a diferentes estados.





## Manejo de estados

Se pueden utilizar los valores de status y error del store:

* Mostrar indicadores de carga;
* Mostrar datos cuando estén disponibles;
* Mostrar errores cuando ocurra una falla.




```javascript
const { items, status, error } = useSelector((state) => state.posts);

if (status === 'loading') {
  return <p>Loading...</p>;
}

if (status === 'failed') {
  return <p>Error: {error}</p>;
}

return (
  <ul>
    {items.map((post) => (
      <li key={post.id}>{post.title}</li>
    ))}
  </ul>
);
```

Los usuarios necesitan retroalimentación.
Sin manejar estos estados, la aplicación parece estar rota o no responde.



Aprende a gestionar el estado complejo de aplicaciones en React utilizando Redux Toolkit. Comprende cuándo realmente se necesita Redux, construye el estado con slices, maneja datos asíncronos y conecta todo en un flujo predecible.

Comprender por qué existe Redux Toolkit y cuándo se vuelve útil. Reconocer cómo la complejidad del estado aumenta en aplicaciones reales y por qué los enfoques simples dejan de escalar.

Instalar Redux Toolkit y configurar el store. Conectar Redux a una aplicación React y comprender cómo fluye la información a través del sistema.

Definir el estado utilizando slices y organizar la lógica de manera clara. Crear reducers, utilizar acciones generadas y mantener el estado manejable a medida que la aplicación crece.

Leer datos del store utilizando useSelector y actualizarlos con useDispatch. Estructurar el estado correctamente y evitar errores comunes al trabajar con datos compartidos.

Obtener datos de APIs utilizando createAsyncThunk. Gestión de estados de carga y error y mantenimiento de la interfaz de usuario sincronizada con actualizaciones asíncronas.

Dividir el estado en múltiples slices y organizar los archivos por funcionalidad. Combinar los reducers de manera ordenada y mantener una estructura clara a medida que la aplicación crece.

Construcción de una aplicación completa utilizando Redux Toolkit. Implementación de funciones CRUD, manejo de datos asíncronos y mejora de la experiencia del usuario con estados de carga y error.

Gestión de Estados de Carga y Error

El problema

Manejo de estados