1

Resumen de curso - Hecho en React c/redux

Proyecto de Blog para práctica del curso de Redux por bedu de Platzi

npm install
Para instalar las dependencias del proyecto

npm start
Para iniciar el proyecto en modo desarrollo en el puerto 3000

Visitar la versión deploy https://ariel-ayala-blog-en-redux.now.sh/


<h3>Anotaciones del curso</h3>
<h4>Ciclo de vida de componentes en React</h4>

Tenemos 4 fases por los que un componente pasa:

  • Initialization: Declaramos nuestro estado o propiedades
  • Mounting: Todo componente debe tener render. Es obligatorio.
  • Updation
  • Unmounting: Solo hay una función en caso de que queramos hacer algo cuando se destruya un componente
Ciclo de vida de componentes en React
<h4>Manejo de promesas</h4>

Una Promesa es un proxy para un valor no necesariamente conocido en el momento que es creada la promesa.
Las promesas tienen tres estados:

  • pending
  • fullfilled
  • rejected

Las promesas se invocan de la siguiente forma:

newPromise( ( resolve, reject ) => {
// --- llamado asíncrono if( todoOK ) { 
        // -- se ejecutó el llamado exitosamente resolve() }else { 
        // -- hubo un error en el llamado reject() 
        } 
} )
<h4>¿Qúe es Redux, cuándo usarlo y porqué?</h4>

Es una herramienta de uso libre que nos permite manejar todo el estado de nuestra aplicación en un solo lugar.<br>

Principios<br>

  • Almacenamiento
  • Inmutable
  • Centralizado

Redux es nuestra única fuente de la verdad.

<h4>Las fases de Redux</h4>
  • Store: El principal de redux, almacena toda la información y los estados.
  • Redurecs: Son (dependiendo de los componentes) la información que vamos a tener.
  • Action creators: Las funciones que debemos ejecutar para pedir informaciòn (normalmente son promesas).
  • Componente (JSX): Los componentes de React que estamos viendo en la interfaz.
Funcionamiento de Redux
<h4>Store</h4>

El store tien las siguientes posibilidades:

  • Contiene el estado de la aplicación
  • Permite el acceso al estado vía getsate()
  • Permite que el estado sea actualizado vía dispatch (action)
  • Registra los listeners vía suscribe(listener)
  • Maneja la anulación del registro de los listeners vía el retorno de la función de subscribe(listener)
<h4>Reducers</h4>

Las Action creators describen que algo pasó, pero no especifican cómo cambió el estado de la aplicación en respuesta. <br>
Esto es trabajo de los reducers<br>
El Provider es el componente de Redux en el cual encerraremos nuestra aplicación para que puedan comunicarse los componentes entre ellos.

<h4>Redux Thunk</h4>

Redux Thunk permite a las actions creators invertir el control despachando funciones. <br>
Van a recibir dispatch como argumento y capaz llamarlo asíncronamente. Estas funciones son llamadas thunks.

<h4>Ciclo completo de redux</h4>
Ciclo completo de redux
Escribe tu comentario
+ 2