No tienes acceso a esta clase

隆Contin煤a aprendiendo! 脷nete y comienza a potenciar tu carrera

Compra acceso a todo Platzi por 1 a帽o

Antes: $249

Currency
$209/a帽o

Paga en 4 cuotas sin intereses

Paga en 4 cuotas sin intereses
Suscr铆bete

Termina en:

15D
5H
54M
21S

Ciclo de vida de Redux

3/22
Recursos

Aportes 8

Preguntas 1

Ordenar por:

驴Quieres ver m谩s aportes, preguntas y respuestas de la comunidad?

o inicia sesi贸n.

En Vuejs se usa Vuex, la teoria es la misma.

  1. state define UI
  2. en la UI el usuario dispara una acci贸n
  3. la acci贸n es mandada al reducer
  4. el reducer actualiza el store
  5. el store contiene al state
  6. volvemos al paso 1

Esto me recuerda al patr贸n FLUX que utiliza VUEX en el framework VueJS

3.-Ciclo de vida de Redux

  • El estado describe la condici贸n actual de la aplicaci贸n, este estado 鈥渧ive鈥 dentro del store.
  • La vista o UI se renderiza basada en este estado y cuando un evento (como un click) pasa el estado se actualiza basado en lo que pas贸. No se actualiza directamente, es 鈥渄isparado鈥 hac铆a el reducer que es el encargado de saber como se actualizar谩 el estado. Luego de que el cambio pasa y el estado se actualiza la UI se re-renderiza basada en el estado.


Redux es una libreria 鈥渁gnostica鈥, es decir, puede ser usada con cualquier capa en la UI o framework.

Actualizaci贸n de la imagen:
En versiones resiente Redux incorpora middlewares para el registro de acciones, la administraci贸n de peticiones as铆ncronas, la gesti贸n de errores, la autenticaci贸n, entre otros.

CICLO DE VIDA REDUX
Despacho de una acci贸n: Un evento de UI, una respuesta de red o cualquier otra fuente despacha una acci贸n, que es un objeto de JavaScript simple que describe el cambio a realizar.

Actualizaci贸n del almac茅n: El almac茅n de Redux recibe la acci贸n despachada y la pasa a la funci贸n reductora. El reductor calcula el nuevo estado en base al estado actual y la acci贸n.

Actualizaci贸n de los componentes: El almac茅n emite un evento de cambio, lo que hace que los componentes que est谩n suscritos al almac茅n vuelvan a renderizarse. El nuevo estado est谩 disponible en el almac茅n y puede ser utilizado por los componentes para renderizar la UI actualizada.

El usuario interact煤a con la UI actualizada: El usuario interact煤a con la UI actualizada, potencialmente provocando otro despacho de acci贸n. Esto comienza el ciclo nuevamente.

Nota: Es importante recordar que el estado debe tratarse como inmutable y no modificarse directamente. Se deben crear nuevos estados para reflejar los cambios.

Les recomiendo leer
Functional Architecture with React and Redux
.
En esta lectura hablan sobre el paradigma de programaci贸n funcional, que promueve el uso de funciones puras y valores inmutables. Para tratar de leer y entender una aplicaci贸n m谩s f谩cil.
.
B谩sicamente Redux nos ayuda a manejar el estado usando este paradigma. Y como todo tiene sus ventajas y desventajas.
.
When should I use Redux? : Oficial Docs
.
De la documentaci贸n que menciono arriba.

Redux is more useful when:

  • You have large amounts of application state that are needed in many places in the app
  • The app state is updated frequently over time
  • The logic to update that state may be complex
  • The app has a medium or large-sized codebase, and might be worked on by many people