Curso React + Redux

Este repositorio contiene las fuentes, ejercicios y soluciones del curso React + Redux (Mayo 2016)

Contenido

1. ¿Qué es React?

• Single Page Applications
• De página Web a aplicación Web
• Problemas comunes y soluciones previas
• Así que... ¿qué es React?
• Virtual DOM
• Montar un proyecto React con Webpack y Babel.js

2. Construyendo componentes React

• Conceptos clave
• ¿Qué es JSX?
• Nuestro primer componente - Hola Mundo
• Visualizar nuestra aplicación React en el browser
• Props y validación de props con PropTypes
• Visualizando listas
• Estado interno de un componente
• Eventos
• Ejercicio - Contador

3. UI complejas mediante composición

• Componentes padre y componentes hijo
• Comunicación hijo a padre
• Ejercicio - Nuestra primera app completa: Cronómetro
• Formularios y controles de formulario
• Ejercicio - Base de datos de personajes
• Ciclo de vida de un componente
• Optimización de rendimiento
• Ejercicio - Construyendo una aplicación real: Ecommerce

4. Redux

• Qué es Redux
• Los 3 principios de Redux
• Estado global
• Acciones
• Reducers
• Store de Redux
• Combinación reducers
• Conectar Redux y React
• Organización del código
• Ejercicio - Ecommerce: módulos Route y Catalog
• Encapsular acceso al estado con reselect
• Ejercicio - Ecommerce: módulo Cart
• Conectar Action creators como props con bindActionCreators
• Ejercicio - Ecommerce: componente Cart
• Redux middleware
• Ejercicio - Ecommerce: módulo Order
• Formularios con Redux
• Ejercicio - Ecommerce: terminar la aplicación

5. React y Redux en el mundo real

• Redux DevTools
• Introducción a React Router
• Configuración de rutas y búsqueda de coincidencias
• Rutas anidadas
• Ejercicio - Añadir rutas a nuestro Ecommerce
• Navegar desde componentes con Link
• Navegar desde código y confirmar navegación
• Integrar React Router con Redux - navegar mediante action creators
• Ejercicio - Terminar rutas en nuestro Ecommerce
• Acceso a APIs REST con Redux
• GET y POST con fetch
• Acciones asíncronas con Redux
• Ejercicio - Ecommerce: cargar catálogo desde el servidor

6. Testing

• Motivos
• Mocha
• Aserciones con assert y should
• Mocking son sinon: spies, stubs
• Infraestructura de testing: ES6, JSX
• Testing de componentes: shallow rendering
• Testing de reducers
• Testing de action creators
• Cobertura de código