DESARROLLO FRONT-END CON REACT

Tema 1: Introducción a React y TypeScript

- Introducción a TypeScript
- Introducción a React y su Virtual DOM
- Introducción a JSX- Operadores y sintaxis comunes de Javascript centrada en React
- React DevTools
- Ejercicios prácticos: Preparación del entorno de desarrollo y proyecto inicial con React y TypeScript

Tema 2: Componentes en React

- Qué es un componente
- Ciclo de vida y renderizado de los componentes en React
- Tipos de componentes en React
- Estilando nuestros componentes
- Cómo crear componentes reutilizables
- Tipando los componentes con TypeScript
- Ejercicios prácticos: Crear nuestros primeros componentes del proyecto

Tema 3: Testing en React

- Introducción al testing
- Preparar el proyecto para testear
- Testeando componentes en React
- Ejercicios prácticos: testeando nuestros componentes

Tema 4: Eventos en React

- Eventos en el navegador
- Event listeners y event propagation en React
- Handlers y callbacks
- Ejercicios prácticos: reaccionando a acciones de los usuarios en nuestros componentes
- Ejercicios prácticos: testeando las interacciones de usuario en nuestros componentes

Tema 5: Hooks I: useState

- Para qué se utiliza useState y por qué es necesario
- Cuándo utilizar useState: buenas prácticas
- Ejercicios prácticos: añadir estado a los componentes de nuestro proyecto

Tema 6: Rutas en React

- Diferencias entre enrutado en web y en React
- Configurar React-router
- Organizar las rutas en aplicaciones complejas
- Trabajando con queryParams y rutas dinámicas
- Ejercicios prácticos: Añadir rutas a nuestro proyecto

Tema 7: Hooks II: useEffect

- Para qué se utiliza useEffect y por qué es necesario
- useEffect en el ciclo de vida de un componente
- Valor vs Referencia
- Buenas prácticas para evitar efectos inesperados
- Ejercicios prácticos: usando useEffect en nuestros componentes

Tema 8: HTTP, Promesas y Asincronía en React

- En qué consiste el protocolo HTTP
- Promesas y asincronía
- Trabajando con APIs en React
- Debounce & Throttle
- Mocks para testear llamadas asíncronas
- Ejercicios prácticos: Nuestra primera funcionalidad completa con estado asíncrono, efectos y trabajando con la API

Tema 9: Trabajando con Formularios en React

- Conceptos básicos de formularios
- Instalación y uso de React-hook-forms
- Ejercicios prácticos: Añadir formularios a nuestro proyecto

Tema 10: Context API

- Para qué se utiliza el contexto y por qué es necesario
- Cuándo crear y consumir un contexto, buenas prácticas
- Ejercicios prácticos: Añadir contexto en nuestro proyecto

Tema 11: Creando custom hooks

- Cómo crear hooks personalizados para hacer nuestro código aún más reutilizable
- Ejercicios prácticos: Refactorizar nuestros componentes con custom hooks

Tema 12: Hooks III useMemo y useCallback

- Qué es la memorización en programación
- Cuándo memorizar
- Memoización en React, useMemo y useCallback
- useMemo, useCallback y useEffect
- Memoizar un componente entero en React para mejorar el rendimiento
- Ejercicios prácticos: Añadir búsquedas y filtros gestionados en el front

Tema 13: localStorage y cookies

- Qué es el local storage y cuándo utilizarlo
- Qué son las cookies y diferencias con el local storage
- Cuándo utilizar uno y otro
- Ejercicios prácticos: Guardar preferencias del usuario en el local storage

Tema 14: Redux como gestor de estado

- Qué es redux, cuándo es necesario y cuándo no
- Buenas prácticas de Redux
- Ejercicios: Añadir redux a nuestro proyecto

Tema 15: Hooks IV useRef

- Para qué sirve useRef
- Cuando utilizar useRef
- Ejercicios prácticos: Aplicar useRef a alguno de nuestros componentes


Curso dirigido por José Miguel González.