Lecciones del curso

Crea aplicaciones con React y Redux

¿Para qué sirve React?
8m
Introducción a React
7m
Usando ReactJS
Recapitulando
CodeSandbox
create-react-app
Babel-Standalone
Tu primer componente
Creando más componentes
Tipos de componentes
Modularización
Estructura de carpetas y componentes
State y Props
Usando props
Eventos básicos de React
Función extra "for the lols"
Introducción a Yarn
Estructura básica de carpetas
Primer componente en Create-React-App
Segundo componente con props
Estilos en React con css normal
Estilos en React con css modules
Creando el componente login
Instalando React Router
Instalación de Redux
Configurando Redux parte 1 | rootReducer
Configurando Redux parte 2 | Store
Configurando Redux parte 3 | Provider
Agregando Redux dev tools
Agregando la ruta Profile
Usando Redux | Connect
Usando Redux | Creando Constants y Actions
Usando Redux | Usando Actions en los componentes
Agregando un backend | Firebase
Usando Auth de Firebase con Redux

Redux

Qué es Redux

Redux es un contenedor predecible del estado de aplicaciones JavaScript.

Te ayuda a escribir aplicaciones que se comportan de manera consistente, corren en distintos ambientes (cliente, servidor y nativo), y son fáciles de probar. Además de eso, provee una gran experiencia de desarrollo, gracias a edición en vivo combinado con un depurador sobre una línea de tiempo.

Como los requisitos en aplicaciones JavaScript de una sola página se están volviendo cada vez más complicados, nuestro código, mas que nunca, debe manejar el estado. Este estado puede incluir respuestas del servidor y datos cacheados, así como datos creados localmente que todavía no fueron guardados en el servidor. El estado de las UI también se volvió más complejo, al necesitar mantener la ruta activa, el tab seleccionado, si mostrar o no un spinner, si deben mostrarse los controles de paginación o no.

Influencias

Redux evoluciona las ideas de Flux, pero evitando su complejidad tomando cosas de Elm. Ya sea que los hayas usado o no, solo toma unos minutos para empezar a usar Redux.

Happy Coding! ❤

Recursos extra

spaceman

¿List@ para ver todo el curso? Prepárate porque apenas estamos comenzando 🚀

¡Desbloquea el curso completo y conviértete en un PRO del desarrollo web! 🫶🏻 .