Bienvenido al curso

1

Conoce a tu profesor y todo lo que aprenderás sobre Redux

2

¿Qué conocimientos me recomiendan para tomar este curso?

Repaso React

3

¿Qué es React y cómo funciona?

4

Preparando nuestro entorno de trabajo

5

Creación de la app con React

6

Agregando funciones a la app con React

7

Stateful vs Stateless

8

Ciclo de vida de React

9

Manejando promesas

10

React Router DOM

Introducción a Redux

11

¿Qúe es Redux, cuándo usarlo y por qué?

Fases de Redux

12

Introducción: las fases de Redux

13

Store

14

Reducers

15

Conexión a un componente

16

Action Creators

17

Redux Thunk

18

Explicación teórica: ciclo completo de Redux

19

Práctica: ciclo completo de Redux

Fases Extra

20

Archivos Types

21

Try Catch

22

Escenarios asíncronos

23

Componente Spinner

24

Componente Fatal

25

Tabla como componente

Compartir información en Redux

26

Introducción Compartir información en Redux

27

Parámetros por URL

28

Compartir Reducer

29

Múltiples Reducers

30

Llamando a múltiples reducers en una acción

31

Uso del estado en la acción

32

Evitar segundas búsquedas

33

Inmutabilidad

34

Evitar sobrescritura

35

Validación compuesta

36

Validación de errores

37

Modificando respuesta de url

38

Estado con interacción

39

Mostrar componentes dinámicamente

40

Llamadas asincronas dinámicas

41

Props por herencia vs estado

42

Estado compartido

Métodos HTTP

43

Introducción a métodos HTTP

44

Nuevo ciclo Redux

45

Normalizar datos

46

Mapear Objetos

47

Componente para agregar tarea

48

Manejar inputs con Reducer

49

POST

50

Deshabilitando botón

51

Redireccionar

52

Reutilizar componentes

53

PUT

54

DELETE

55

Últimos detalles

Conclusión

56

Conocimientos adquiridos

57

Qué hacer a continuación

No tienes acceso a esta clase

¡Continúa aprendiendo! Únete y comienza a potenciar tu carrera

Curso de Redux por Bedu

Curso de Redux por Bedu

Rodolfo Saldivar

Rodolfo Saldivar

Uso del estado en la acción

31/57
Recursos

Aportes 29

Preguntas 5

Ordenar por:

Los aportes, preguntas y respuestas son vitales para aprender en comunidad. Regístrate o inicia sesión para participar.

A algunos les parecerá algo confuso o demasiado código para hacer algo tan simple que se puede arreglar pasando el id desde el Link y haciendo el fetch con ese valor.
'
El motivo de esta clase fue mostrar que podemos usar el estado actual de la aplicación desde un action.
'
Recuerden que Redux está pensado para aplicaciones grandes o que desde el inicio su plan es escalar muchísimo, es por eso que en un proyecto pequeño parece demasiado lío.
'
Yo entiendo que esto nos servirá cuando estamos haciendo todo de manera modular. Nos evita tener que pasar todas las props de componente a componente, por lo que, entre más crezca el proyecto, el código será más fácil de mantener.

muy confuso!!!

  1. Creamos un nuevo action creator traerPorUsuario() que recibe por parámetro la key (es el índice del ítem del arreglo)

  2. Hacemos que primero llame el actions creator de usuariosTraerTodos() con un await y luego que llame el action de traerPorUsuario(MANDAMOS_KEY) y le mandamos por parámetro la key (es el índice del ítem del arreglo)

  3. Este actions creator traerPorUsuario() accede a todos los usuarios con getState(), y del usuario que llego saca el id, realiza la petición trae todas las publicaciones de este usuario y hace el dispatch de tipo TRAER_TODOS

Y ya tenemos las publicaciones de ese usuario en especifico

Por que al profesor le arroja 4 resultados y a mi me arroja 5 ?

Como sugerencia, mejor dicten las clases con hooks, tremendas referencias que estan saliendo… this.props.match.params.key, que es es parametro de un this.props.blablabla

yo siempre use el id que proporciona la api de jsonplaceholder. la pase como parámetro de URL y así hice la búsqueda de los post me pareció mas sencillo de implementar que usar el key del metodo map()

Excelente clase. Gracias a algo que vi en esta clase entendí perfectamente lo que significa async await, antes no lo entendía muy bien jaja. Es como desbloquear una tubería que no dejaba pasar el agua. 🙂

No solo la clase… el curso en sí esta demasiado bien explicado.

¿Por qué hacerlo confuso? a mi parecer hasta el momento no es necesario obtener todos los usuarios y en la ruta se pudo poner el id del usuario y no la key y así hacerlo más directo

Esta clase me pareció super util

Excelente, bastante bien administrado el uso de la información

No me confunde de esta manera.
Además, el mismo nombre del capítulo especifica la razón de hacerlo así

Una pregunta puedp usar el mismo nombre de la carpeta en ves de INDEX.JS
Por ejemplo en la carpeta reducers hay un INDEX.JS pero podria ponerle de nombre reducers.js ?

Buen día.

Se me presenta un problema al cargar los datos, aparecen los mismos en el objeto usuariosReducer y en el objeto publicacionesReducer

He revisado el código y parece estar bien, al menos el INITIAL_STATE tiene la propiedad usuarios en usuariosReducer y publicaciones en publicacionesReducer

También podríamos pasarle el Id en vez de pasarle el index que sacamos de el método map, con eso solamente lo enviamos con el porps match y lo obtenemos reemplazando de una vez con el id en la URL.

Sin duda una de las cosas mas dificiles de redux es el manejo de tareas asincronas y hay diferencias para hacerlo entre componentes de clase y funcionales. En los funcionales requiere un poquito de trucos. Estas clases sin duda me estan haciendo la vida mas facil

Mandar por parametro una variable para ser usada en las acciones de reducer

Hacer uso de los datos del estado de un reducer en un action

Excelente contenido

Por alguna razon me sigue jalando todas la publicaciones y no por usuarios. No se donde puede estar el error, trate de buscarlo en todo lo referene a las publicaciones y el key.

En un proyecto personal tuve que manejar los actions con async/await para que funcione. Y no tengo llamas a url, simplemente llama a una función compleja con dos for. ¿Por qué sucede esto?

getState

Brutal

Ahora a recorrer las publicaciones que nos arroja para mostrarlas en pantalla

Por que no simplemente se pasa el id del usuario por parametro, desde la accion ver, asi se ahorra la busqueda que se esta haciendo en el publicacionesActions, entonces en el iterador no se pasa el key del map, si no el id del usuario directamente, quedando grabada en la url.

Me gustaria que mi consola me salga tan limpia y bonita como la del profe pero así está:

cuando sabes que existen hooks para esto es mas simple 😄

No entiendo porque trae todo los usuarios en el componente de publicaciones ¿Cuál es la finalidad de traer todos los usuarios dentro de un componente que se enfoca en uno solo y sus publicaciones?

en el axios en vez del usuario_Id podías poner el key también