Introducción
  • Introducción al curso
  • ¿Cómo funcionará el curso?
  • ¿Cómo hacer preguntas?
  • Instalaciones necesarias y recomendadas
Introducción a React y conceptos generales
  • Introducción a la sección
  • Temas puntuales de la sección
  • ¿Qué es React?
  • Primeros pasos en React
  • Introducción a Babel
Introducción a JavaScript moderno
  • Introducción a la sección
  • Temas puntuales de la sección
  • Inicio de proyecto - Bases de JavaScript
  • Variables y constantes
  • Template String
  • Objetos lilterales
  • Arreglos
  • Funciones
  • Desestructuación de Objetos
  • Desestructuación de Arreglos
  • Import, export y funciones comunes de arreglos
  • Múltiples exportaciones y exportaciones por defecto
  • Promesas
  • Fetch API
  • Async - Await
  • Operador condicional ternario
  • Nota sobre JavaScript
  • Código fuente de la sección
Primeros pasos en React
  • Introducción a la sección
  • Temas puntuales de la sección
  • ¿Qué son los componentes?
  • Primera aplicación de React
  • Estructura de directorios
  • Contenido de la carpeta SRC
  • Hola Mundo en React
  • Nuestro primer Componente
  • Retornar elementos en el Componente - Fragment
  • Impresión de variables en el HTML
  • Comunicación entre componentes - Props
  • PropTypes
  • DefaultProps
  • Componente CounterApp
  • Evento click (Eventos en general)
  • useState - Hook
  • handleSubtract y handleReset
  • Código fuente de la sección
Pruebas unitarias y de integración - Probando las secciones anteriores
  • Introducción a la sección
  • Temas puntuales de la sección
  • Introducción a las pruebas unitarias y de integración
  • Inicio de la sección - Pruebas sobre lo aprendido anteriormente
  • Mi primera prueba
  • Jest - Expect - toBe
  • Pruebas en el archivo 02-template-string.js
  • toEqual
  • Pruebas en el archivo 07-deses-arr.js
  • Pruebas en 08-imp-exp.js - Arreglos
  • Pruebas con tareas asíncronas
  • Pruebas con async-await
  • Pruebas sobre componentes de React
  • Enzyme - Testing unit
  • Revisar elementos dentro del componente
  • Pruebas básicas del CounterApp
  • Simular eventos - Click
  • Pruebas con el botón de reset
  • Código fuente de la sección
GifExpertApp - Aplicación
  • Introducción a la sección
  • Temas puntuales de la sección
  • Resultado al final de la sección
  • Inicio de proyecto - GifExpertApp
  • GifExpertApp - Component
  • Creando una lista de categorias
  • Componente AddCategory
  • Comunicación entre componentes
  • Fetch API - Obtener las imágenes deseadas
  • useEffect
  • Mostrar los títulos de las imágenes
  • className - Clases de css
  • Helpers - getGifs
  • Custom Hook
  • useFetchGifs - obtener imágenes y bandera de carga
  • Animaciones por CSS en nuestra aplicación
  • Código fuente de la sección
Generando el build de producción y despliegues en Github Pages
  • Introducción a la sección
  • Temas puntuales de la sección
  • Preparación del proyecto - Github Pages
  • Desplegando aplicación en Github Pages
Testing - Probando la aplicación de GifExpert
  • Introducción a la sección
  • Temas puntuales de la sección
  • Configurar el ambiente de pruebas
  • Implementando PropTypes y Actualizar Snapshots
  • Pruebas del componente - GifGridItem
  • Pruebas en el helper getGifs
  • Pruebas del componente - AddCategory