Alguna información sobre Redux

Dan Abramov - Live React: Hot Reloading with Time Travel at react-europe 2015


https://www.youtube.com/watch?v=xsSnOQynTHs

https://github.com/gaearon

https://redux.js.org/

https://twitter.com/dan_abramov

  • Redux: es una librería creada por @dan_abramov, para manipular los datos de una forma separada de la interfaz, similar a lo que hace webpack con la opción hot-reload

  • Es un contenedor del estado predecible para aplicaciones de JavaScript de front-end complejas.

Componentes en Redux:

  • Store: Es el centro y la verdad de todo, con métodos para actualizar, obtener y escuchar datos.
  • Actions: Son bloques de información que envian datos desde la aplicación hacia el store.
  • Reducers: Cambian el estado de la aplicación.

Ciclo de Redux

Básicamente el ciclo de Redux sería algo como:

  • Tienes tu vista (UI)
  • Tu vista va a enviar una acción
  • Tu acción va a llamar un reducer
  • Tu reducer va a llamar a tu store
  • Tu store va a actualizar el estado
  • El estado va a actualizar tu vista (interfaz/UI)
  • Redux debe utilizarse de una manera responsable, para no caer en el error de aplicar sobre ingeniería (exceso de complejidad) a tus aplicaciones sencillas … eso sería contraproducente a lo que intenta resolver Redux.

Principios a tener presentes al trabajar con Redux

  1. Única fuente de verdad:
    El estado de toda tu aplicación esta almacenado en un árbol guardado en un único store lo que hace mas fácil el proceso de depuración.

  2. Solo Lectura:
    La única forma de modificar el estado es emitiendo una acción, un objeto que describe que ocurrió.

  3. Los cambios se realizan con funciones puras:
    Los reduces son funciones puras que toman el estado anterior y una acción, y devuelven un nuevo estado.

Ejemplo básico sobre el uso de Redux

https://github.com/Whistler092/TODO-List