Introducción a Redux.js

Sergio Daniel Xalambrí

@sergiodxa

¿Qué es Redux?

Es una librería para manejar el estado de nuestra aplicación

Tres Principios

Una sola fuente de la verdad

Todo el estado de tu aplicación esta contenido en un único store

El estado es de solo lectura

La única forma de modificar el estado es emitir una acción que indique que cambió

Los cambios se hacen mediante funciones puras

Para controlar como el store es modificado por las acciones se usan reducers puros

¿Cómo funciona?

Vista

Store

Acciones

Reducers

Dispara

Actualizan

Pasan por

Manda datos

Store

  • El lugar donde se almacenan los datos
  • Solo se guardan datos serializables
  • Es inmutable
  • Solo hay uno por aplicación

Vista

  • Redux es agnóstico de Vista
  • Puede ser React-Angular-Backbone-*

Acciones

  • Representan un cambio en el estado
  • Son objetos planos de JavaScript (POJO)
  • Tienen un type y un payload
  • Definen datos adicionales en un key meta
  • Si hay un error lo definen en el key error

Reducers

  • Son funciones puras
  • Reciben el estado actual y una acción
  • Devuelven el nuevo estado

¡Redux es extendible!

Por medio de Middlewares

Middlewares

  • Son funciones con side-effects
  • Sirven para extender la funcionalidad del Store
  • Se pueden usar para multitud de cosas

Ejemplo:

logging, error handlers, analytics, soporte a promesas u observables

Introducción a Redux.js

By Sergio Xalambrí

Introducción a Redux.js

Rápida introducción a qué es y cómo funciona Redux.js.

  • 2,138