¿Qué es un reducer?

Resumen de la clase:
¿Qué es un reducer?

• Son una herramienta que nos permite declarar todos los posibles estados de nuestra App para llamarlos de forma declarativa.
• Necesitan 2 objetos esenciales: los estados compuestos y las acciones.

Los estados compuestos:

• Son un objeto donde van a vivir como propiedades todos nuestros estados

Acciones

• Responsables, al ser disparados, de pasar de un estado a otro.
• Este objeto tiene 2 propiedades: action type y action payload.

Action type:

• Define el nombre clave para encontrar el nuevo estado.

Action payload:

• Es opcional e importante con estados dinámicos. Un estado es dinamico cuando depende del llamado de un API, de lo escrito por el usuario en un input, etc. Estos son estados dinámicos y los recibimos con un payload.

Flujo de trabajo:

• Definimos distintos tipos de acciones con type y payload.
• Enviamos estas acciones a nuestro reducer.
• El reducer define los posibles estados por donde pasara nuestra App.
• Con action type elegimos cual de esos estados queremos disponer con el cambio o evento del usuario.
• Con action payload damos dinamismo a dicho estado. Será el mismo estado pero le daremos características especiales

Excelente video! Servirá para aquellos que quieran implementar y empezar a usar Redux.

Si que tiene sentido aprender useReducer antes de pensar en redux

¿Qué es un reducer?

Son herramientas para declarar los estados de la aplicación. Usan estados compuestos.

Vamos a manejar acciones:

• Action Type -> qué haremos
• Action Payload -> qué información mandamos (es opcional y sirve para estados dinámicos)

Muy claro el tema. Excelente 😄

Les comparto mis apuntes de este punto del curso.

Aqui tiene un post por si quieren profundizar en el uso de useReducer
https://ewebik.com/react-js/usereducer

Lectura recomendada

https://www.w3schools.com/react/react_usereducer.asp

Honestamente se esta ruta ha mejorado mucho, repsando conceptos para alguien que va empezando. Lo va a enteder mucho mejor este concepto de Redux que veremos en un futuro no muy lejano, este y con el anterior curso de Patrones de render se han visto los siguientes conceptos que aconsejo aprender:

• HOC(Higher order components)
• reducers.

Antes tenias que aprender primero Vue.js para tener algo más claro acerca de Redux, me alegra tener muchos conceptos más claros.

¿Qué es un reducer?
Es una herramienta que nos permite declarar todos los posibles estados de la aplicación para que podamos usarlos de forma muy declarativa.

Los reducers necesitan dos objetos, el primero es el estado compuesto o “compone state“ que son un objeto donde los estados son sus propiedades y solo tenemos una función actualizadora para todos estos estados. El otro objeto son las acciones, que son las que enviamos a nuestro reducer para que podamos actualizar el valor de los estados, estas acciones también son un objeto que tienen dos propiedades:

Action Type: Qué le dice al reducer cuál es nombre clave para encontrar el estado que vamos a modificar.

Action Payload: (Optional) se usa para los estados dinámicos, que son los estados que su nuevo valor depende de otro evento cómo puede ser el llamado a una API, de los que escriban los usuarios en un input, etc.

El flujo sería algo cómo:

Actions → Reducer → New State

Buena definición de un reducer, ahora entiendo más conociendo que se intenta hacer el código más declarativo, manteniendo el manejo de estado y lógica aún más separada del jsx

Mis apuntes de Notion💚

UseState es redux bien hecho