Qué es Redux

Clase 9 de 29 • Curso de React Router 5 y Redux

Resumen

Redux es una librería escrita en JavaScript, basada en la arquitectura Flux y creada por Dan Abramov, se basa en 3 principios fundamentales:

Solamente hay una fuente de la verdad.
El estado es de solo lectura.
Solamente podemos utilizar funciones puras.

Nuestra UI va a activar una action, esta action va a ejecutar un reducer para modificar la información del store, y al actualizarse el store la UI se va a modificar.

Marifer Villarroel

student•

Hola, comparto este articulo para poder entender mejor la arquitectura Flux

José Tuzinkievicz

student•

Buneísimo, me sirvió de mucho. Gracias.

Danelia Sanchez Sanchez

student•

Excelente aporte @mafevito 👍

José Tuzinkievicz

student•

Bernardo Aguayo Ortega

student•

just like that!

Seba Cardoso

student•

Vale aclarar que Redux no es para todas las apps. Se podría decir que son para medianas y grandes apps. Donde se maneja mucha información. Es una forma de organizar el flujo de información. Es una arquitectura.

Alejandro González Reyes

student•

En el curso de Redux que dicta Leónidaz terminó por confundirme, el estado viajaba de componente en componente anidado. La verdad no le encontré sentido ya que se parece a un EventBus de VueJS.

Jhoan Sebastian Rodriguez Sanchez

student•

Si básicamente es un arquitecturas, entonces para proyectos pequeños no vale la pena usarlos?

Esteban Casallas

student•

Redux se basa en Flux, aquí sus diferencias en una imagen interesante que puede servir !

Miguel Angel Reyes Moreno

student•

Gran imagen :)

Jose Daniel Molina

student•

Redux se basa en 3 principios fundamentales:

Solamente hay una fuente de la verdad.
El estado es de solo lectura.
Solamente podemos utilizar funciones puras.

Tengo ansias de enfrentarme a Redux :D

Andrés Felipe Eslava Zuluaga

student•

Observen éste hermoso tutorial de Redux en caso tal! Lo recomiendo mucho! HAGAN CLICK ACÁ PARA TUTORIAL DE REDUX

Nelson Gonzalez Escalante

student•

Única fuente de la verdad El estado de toda tu aplicación esta almacenado en un árbol guardado en un único store.

Esto hace fácil crear aplicaciones universales, ya que el estado en tu servidor puede ser serializado y enviado al cliente sin ningún esfuerzo extra. Como un único árbol de estado también hace más fácil depurar una aplicación; te permite también mantener el estado de la aplicación en desarrollo, para un ciclo de desarrollo más veloz. Algunas funcionalidades que históricamente han sido difíciles de implementar - como Deshacer/Rehacer, por ejemplo - se vuelven triviales si todo tu estado se guarda en un solo árbol.

El estado es de solo lectura La única forma de modificar el estado es emitiendo una acción, un objeto describiendo que ocurrió.

Esto te asegura que ni tu vista ni callbacks de red van a modificar el estado directamente. En vez de eso, expresan un intento de modificar el estado. Ya que todas las modificaciones están centralizadas y suceden en un orden estricto, no hay que preocuparse por una carrera entre las acciones. y como las acciones son objetos planos, pueden ser registrados, serializados y almacenados para volver a ejecutarlos por cuestiones de depuración y pruebas.

Los cambios se realizan con funciones puras Para especificar como el árbol de estado es transformado por las acciones, se utilizan reducers puros.

Los reducers son funciones puras que toman el estado anterior y una acción, y devuelven un nuevo estado. Recuerda devolver un nuevo objeto de estado en vez de modificar el anterior. Puedes empezar con un único reducer, y mientras tu aplicación crece, dividirlo en varios reducers pequeños que manejan partes específicas del árbol de estado. Ya que los reducers son funciones puras, puedes controlar el orden en que se ejecutan, pasarle datos adicionales, o incluso hacer reducers reusables para tareas comunes como paginación.

Sergio Estrella

teacher•

A modo de introducción más detallada, me gusta la explicación que dio Nicolás Molina de Redux. Te dejo aquí el enlace para que la veas ;) Cabe destacar también que Redux se puede utilizar en más frameworks y librerías que solo React! Cada uno implementa una librería, pero el patrón que usan es el mismo que explicaron en la clase :D

David Dias

student•

Flux viene siendo un modo de hacer las cosas en Javascript, es una manera ordenada de manejar el flujo de información muy util para poder manejar errores correctamente. Redux es un framework que nos permite implementar el patrón Flux de la mejor manera

Laura Camila Pregonero

student•

Redux es una librería escrita en JavaScript , basada en la arquitectura FLUX y creada por Dan Abramov .

1: Solamente hay una fuente de la verdad. 2: El estado es de solo lectura. 3: Solamente podemos utilizar funciones puras.

Jean Nuñez

student•

Redux redux que importante eres

Wandy Rafael Santana Evangelista

student•

Aqui les comparto la documentacion de Redux, asi vayan entrando en materia antes de seguir con la siguiente clase: Click Aqui

ANTHONY JEAMPIER RANGEL RODRIGUEZ

student•

Usuario anónimo

user•

Redux es una librería escrita en JavaScript, basada en la arquitectura Flux y creada por Dan Abramov, se basa en 3 principios fundamentales:

Solamente hay una fuente de la verdad. El estado es de solo lectura. Solamente podemos utilizar funciones puras.

Julian Parra

student•

React Context API se puede considerar como el reemplazo de redux?

Francisco Ponce

student•

Hola rebound,

Para proyectos pequeños sí pero aun no para controlar es el estado general de una aplicación, un miembro del team platzi nos escribió un blog , al respecto. Está increíble.

Miguel Angel Reyes Moreno

student•

Redux es una librería de JS. Está basada en la arquitectura Flux

Redux se basa en 3 principios fundamentales:

Es una sola fuente de la verdad.
El estado es de sólo lectura.
Sólo podemos utilizar funciones puras.

Joel Eduardo Sánchez Herrera

student•

Es una libreria de JS creada por Dan Abramov que se basa en la arquitectura FLUX propuesta por FACEBOOK. Redux se basa en 3 principios fundamentales

Una sola fuente de la verdad
El estado es de solo lectura
Solo podemos usar funciones puras

Podremos manejar el flujo de la informacion de nuestra aplicacion

Platzi Team

student•

El profe nombre un lenguaje funcional, el cual segun el profe es la inpiracion para la creacion de Redux, alguien logra sabe cual es. Intente buscar informacion pero no lo logre :(

Esteban Casallas

student•

es este: https://elm-lang.org/

Wilson Fabian Pérez Sucuzhañay

student•

El reducer es quien realiza las peticiones a un API Rest o un Punto Graphql.

Héctor Hugo Sandoval Marcelo

student•

Ahora si se viene lo bueno

Qué es Redux

Bienvenida al curso

Todo lo que aprenderás sobre React Router y Redux

¿Qué es React Router? y Aplicarlo en tus proyectos

¿Qué es React Router y cómo instalarlo?

Crear nuestro archivo de Rutas

Container: Login

Container: Register

Container: 404 Not Found

Componente: Layout

Manejando enlaces y configuraciones

¿Qué es Redux?

Qué es Redux

¿Qué es Redux? Profundizando en la herramienta

Instalación de Redux

Creando el Store de Redux

Aplicando Redux a nuestra aplicación

Creando los reducers

Finalizando reducers y eliminar favoritos

Debuggeando nuestro proyecto (agregando validaciones a nuestro componente card)

Crear Formulario de Login

Formulario de Login con Redux

Creando un Servicio para Gravatar

Uso de gravatar en nuestro proyecto

Validación para LogIn LogOut

Register

Register con Redux

Vista general del player

Arreglando la funcionalidad del player

Terminando de detallar nuestro player

Validaciones

Validaciones de UI

Debug con Redux Devtools

Cierre del curso

Cierre del Proyecto