Introducción
- Sobre el autor
- Objetivos del curso
- Donde se encuentra ReactJS en el contexto de una app?
- Composición por sobre la herencia, el porque de ReactJS
Nivelación: ES6 y ES7
- const y let, nos olvidamos de var!
- Fat arrow functions
- Object Destructuring
- Array Spread Operator
- Object Spread Operator
ReactJS con código
- Instalar NodeJS
- Instalar Yarn
- Instalar VS Code
- Hola Mundo!, nuestra primera App ReactJS
- JSX y su similitud con HTML5
- Creando nuevos componentes
- Las props en ReactJS
- El state en ReactJS
- Llevando los componentes a su unidad mínima
- Componentes fáciles de extender
Agregando estilo a nuestra aplicación
- CSS vs inline-style
- inline-style dinámico
- Reutilizando los componentes con estilos
Formularios en ReactJS
- Los campos y manejando los cambios: onChange
- Validaciones de errores de los formularios
- Limpiando el formulario
AJAX
- API Fetch
- axios
Taller - Mantenedor de usuarios
- Definición de la aplicación
- Arquitectura de la solución
- Montando el proyecto
- Componente de lista y de formulario
- Manejando rutas
- Armando la vista del listado
- Mostrando datos recolectados de la API
- Seleccionando el usuario a editar
- Link a nuevo usuario
- Construyendo la vista del formulario
- Validando los campos del formulario
- Creando un nuevo usuario
- Actualizando usuarios existentes
Manejando mejor las rutas: react-router
- ¿Que es react-router? y división de código
- Configurando react-router
- Navegando a través de nuestra app con
- Navegando a través de nuestra app con history
- División de código o code splitting con react-loadable
- react-loadable en la práctica
Manejando mejor el estado: Redux
- ¿Que es redux?
- Conceptos claves y que necesitamos
- Configurando redux
- action types o tipos de acciones
- action creators
- explicando a fondo los reducers
- Conectando nuestros componentes con redux
- despachando acciones
Eliminando boilerplate: redux-form
- ¿Que es redux-form?
- Instalando y configurando redux-form
- Creando formularios
- Validaciones de errores y componentes custom
Taller 2 - Noticias y categorías
- Descripción
- Instalando y configurando dependencias y reducers
- Conectando y extrayendo datos
- Renderizando categorías con su formulario
- Agregando categorías y limpiando el formulario
- Agregando sección de noticias
- Agregando noticias y asociándola a la categoría seleccionada
- Limpiando formulario y filtrando noticias
Manejando efectos de la forma correcta (llamados a la API entre otros)
- Introducción a efectos
- configurando redux-thunks
- Llamando a APIs usando thunks, definiendo tipos y explicando el thunk
Redux avanzado
- redux-ducks
- Visión a futuro, darle forma al estado
- Creador de types
- creador de action creators
- creador de action creators asíncrono
- Mejorando la sintaxis de nuestros reducers
- Higher order reducers
- construyendo middlewares custom
- Corrección del higher order reducer
- Higher order ducks
- Clase extra
