Temario
React (también llamado ReactJS o React.js) es una librería de JavaScript que facilita enormemente el desarrollo eficiente de interfaces de usuario fácilmente mantenibles.
Con React, los desarrolladores pueden gestionar de una forma muy cómoda y sencilla los diversos cambios visuales en el estado de las aplicaciones cuando además combinamos su uso con Redux, un contenedor predecible del estado de aplicaciones JavaScript.
React permite trabajar sobre las vistas del patrón MVC utilizando JSX, lo que hace que la tarea de escribir Javascript sea más sencilla, eficiente, rápida y segura, para especificar el "look" de nuestros componentes sin tener que preocuparnos por el impacto que esto pueda ocasionar en el DOM. Su uso dentro del mundo del desarrollo ha crecido enormemente y de forma muy rápida porque además de su enorme utilidad y eficiencia, juega a su favor como un papel clave su fácil y perfecta sincronización con cualquier tipo de stack tecnológico, al ser una librería pequeña y flexible.
Este Curso de React + Redux tiene como objetivo que aprendas todos los detalles de esta librería de JavaScript para desarrollar interfaces eficientes y fácilmente gestionarbles y testeables de una forma eminentemente práctica. Como metodología de trabajo durante el Curso de React + Redux, los alumnos desarrollarán como prácticas troncales diversas aplicaciones web que servirán además de repositorio de todo lo aprendido.
A quién va dirigido
Front-end developers
App developers
PROGRAMA DE CONTENIDOS
¿,Qué es (y qué no es) React?
La filosofía de React
Node
Webpack
Babel
La famosa "Hello World"
Configurando Webpack
Introducción/repaso de ES6
La función pura
Renderizando un componente «,Hello World»,
JSX y el DOM virtual
Qué es JSX
Qué es el DOM virtual
ReactElement
Descomponiendo una App antes de picar código
Separación de la App en componentes
Componentes «,gestores», VS componentes «,de presentación»,
Esquema «,Padre &ndash, Hijo(s)»,
Flujo de Datos en React
Qué son las «,props»,
One-way data flow
Implementación de un sistema de «,upvote»,
El estado
Qué es el «,state»,
Determinando un dato si se rige por «,state»,
Determinando si una parte de «,state», vive en un componente
Persistencia de datos
React + Express
Cambios en React al cerrar/actualizar el navegador
Implementación de una API para persistir datos en una aplicación de temporizadores
React-router
Configuración de rutas
Implementación de una aplicación con rutas
Peticiones HTTP usando Axios
Axios
Promesas
Montando una aplicación usando la API de SoundCloud o Spotify
Formularios
El botón básico
Eventos y gestores de eventos
Accesando input de usuario con refs
Uso del input de usuario
Componentes «,sin control», VS componentes controlados
Accesando input de usuario con state
Añadiendo validación a nuestra aplicación
Creando un componente para un «,campo»,
React + Redux
¿,Qué es Redux?
El concepto de «,reducer»,
Ventajas Redux para preservar el estado de nuesta app
Ejemplo en vivo con una app de votación
Ejemplo en vivo con una app de tareas pendientes
Bola Extra: Tests unitarios de Aplicaciones React
Testeando con Enzyme