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

Componente para agregar tarea

47/57
Recursos

Aportes 15

Preguntas 1

Ordenar por:

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

Tengo una consulta, para guardarse los datos de forma permanente se tendria que utilizar una base de datos?. En caso de que sea así, como se conectaria la base de datos, con los que se está realizando en está clase. Alguien me podría explicar la lógica?. Muchas Gracias

Conclusión: creamos un componente llamado Guardar.js que se renderiza cuando entren a la ruta /tareas/guardar y que va a servir para guardar una tarea.

Pienso que es mejor que el link recubra todo el boton y no solo el texto y que con estilos se le agregue que el cursor se vuelva la manita

De esta forma

<div>
        <Link to= '/tareas/guardar'>
          <button>
            Agregar
          </button>
        </Link>
       {this.mostrarContenido()}
      </div>

Para no perder los estilos del button la forma de aplicar en Link es

<Link to='/tareas/guardar'>
          <button>Agregar</button>
</Link>	

Parece que el segundo múdulo es más explicativo en lo que hace cada cosa. Igualmente, el curso es exigente y agradable

Excelente clase. 🙂

Excelente clase.

Cuando se agreguen tareas nuevas va hacer imposible que se visualicen a tiempo real verdad ?

Que diferencia hay en las siguientes líneas de código ?
La primera no me muestra subrayada el save en el button y la otra si, Rodolfo lo hace de la segunda manera, que puede afectar si lo hago de la primera forma ?

<Linkto="/Save">
<buttononClick={this.Saludar}>Save</button>
</Link>

<button>
  <Linkto="/Save">Save</Link>
</button>

en que momento se cierra el render?

Excelente

Excelente clase!

Excelente contenido para crear las tareas

Vamos

import React, { Component } from 'react'

class Guardar extends Component {
    render() {
        return (
            <div className="formulario">
                <h1>Saving</h1>
                <label>User ID:</label>
                <input type="number"/>
                <label>Titulo:</label>
                <input type="text"/>
                <button>Save</button>
            </div>
        )
    }
}

export default Guardar```