29 módulos141 lecciones~23h 47min
React Desde Cero
Aprende React desde cero hasta nivel profesional. Hooks, Context API, React Router, React Query, TypeScript, testing, optimización y Next.js. Con proyecto final deployado.
Temario del curso
1
Instalación y Configuración del Entorno
0 / 4 lecciones
1
Node.js, npm y gestores de paquetes15 min
2
Git, VS Code y extensiones esenciales20 min
3
Crear tu primer proyecto React con Vite17 min
4
ESLint, Prettier, aliases y variables de entorno16 min
2
JavaScript Moderno para React
0 / 4 lecciones
1
Variables, tipos, operadores, condicionales y bucles16 min
2
ES6+: let, const, arrow functions y template strings17 min
3
Destructuring, spread y rest operator20 min
4
Asincronía: promesas, async/await y Fetch API14 min
3
Introducción a React
0 / 2 lecciones
1
¿Qué es React? Historia, Virtual DOM y por qué importa8 min
2
Cómo React renderiza: árbol de componentes y flujo de datos10 min
4
JSX
0 / 3 lecciones
1
Sintaxis JSX: expresiones, variables y funciones14 min
2
HTML en JSX: className, fragments y diferencias clave14 min
3
Buenas prácticas JSX: estructura y legibilidad12 min
5
Componentes
0 / 5 lecciones
1
Componentes funcionales: la unidad base de React10 min
2
Props: pasar datos de padre a hijo14 min
3
Children: composición con contenido dinámico13 min
4
Composición de componentes10 min
5
Diseñar componentes reutilizables10 min
6
Eventos en React
0 / 3 lecciones
1
onClick, onChange y onSubmit: los eventos esenciales13 min
2
Manejo de eventos y SyntheticEvent11 min
3
Pasar parámetros a manejadores de eventos11 min
7
Estado con useState
0 / 6 lecciones
1
¿Qué es el estado y por qué React lo necesita?8 min
2
useState: el hook más importante de React13 min
3
Estado con primitivos: números, strings y booleanos12 min
4
useState con arrays y objetos: inmutabilidad11 min
5
Actualizaciones complejas: la función updater12 min
6
Estado derivado: qué NO almacenar en useState11 min
8
Renderizado Condicional
0 / 5 lecciones
1
Renderizado condicional con if y variables11 min
2
Operador ternario en JSX13 min
3
Operador && para renderizado condicional11 min
4
Estados de carga: loading, error y success11 min
5
Estados vacíos: cuando no hay datos11 min
9
Renderizado de Listas
0 / 4 lecciones
1
Renderizar listas con map()14 min
2
La prop key: por qué React la necesita y cómo usarla12 min
3
Filtrar y buscar en listas11 min
4
Ordenar listas en React14 min
10
Formularios
0 / 7 lecciones
1
Inputs controlados: el patrón fundamental12 min
2
Textarea: áreas de texto controladas12 min
3
Select: listas desplegables13 min
4
Checkbox: estado booleano12 min
5
Radio buttons: selección exclusiva12 min
6
Formularios controlados completos13 min
7
Validaciones de formulario sin librerías12 min
11
useEffect
0 / 5 lecciones
1
useEffect y el ciclo de vida del componente11 min
2
El array de dependencias de useEffect10 min
3
Cleanup: limpiar efectos para evitar memory leaks9 min
4
Peticiones HTTP con useEffect8 min
5
Errores comunes con useEffect9 min
12
Estilos en React
0 / 5 lecciones
1
CSS tradicional en React: global y por componente12 min
2
CSS Modules: estilos encapsulados por componente10 min
3
Styled Components: CSS en JavaScript11 min
4
Tailwind CSS con React11 min
5
Responsive design en React11 min
13
Consumo de APIs
0 / 5 lecciones
1
Fetch API: peticiones HTTP nativas9 min
2
Axios: el cliente HTTP del ecosistema React10 min
3
Manejo de errores en peticiones HTTP9 min
4
Loading states: UI durante la carga11 min
5
CRUD completo con una API REST11 min
14
Hooks Fundamentales
0 / 4 lecciones
1
useRef: referencias al DOM y valores persistentes10 min
2
useMemo: memorización de valores costosos10 min
3
useCallback: memorización de funciones10 min
4
useReducer: gestión de estado complejo9 min
15
Custom Hooks
0 / 4 lecciones
1
¿Qué son los custom hooks y por qué importan?9 min
2
Crear tu primer custom hook: useFetch10 min
3
Reutilización de lógica: useLocalStorage, useDebounce11 min
4
Custom hooks en proyectos reales: patrones profesionales10 min
16
Comunicación entre Componentes
0 / 4 lecciones
1
Comunicación padre a hijo: props en profundidad9 min
2
Comunicación hijo a padre: callbacks9 min
3
Comunicación entre componentes hermanos9 min
4
Estado compartido: lifting state up en profundidad9 min
17
React Router
0 / 8 lecciones
1
Instalación y configuración de React Router v610 min
2
Definir rutas con Routes y Route10 min
3
Parámetros de ruta con useParams10 min
4
Query params con useSearchParams9 min
5
Layouts compartidos con React Router10 min
6
Nested Routes: rutas anidadas10 min
7
Rutas protegidas y guardas de navegación10 min
8
Página 404 y redirecciones10 min
18
Context API
0 / 4 lecciones
1
El problema del prop drilling8 min
2
createContext: definir el contrato del contexto10 min
3
useContext: consumir el contexto10 min
4
Providers: estructurar el árbol de contextos9 min
19
Estado Global
0 / 4 lecciones
1
Context API avanzado: patrones de producción9 min
2
Zustand: estado global sin boilerplate11 min
3
Redux Toolkit: el estándar de la industria11 min
4
Persistencia de estado: zustand-persist y redux-persist9 min
20
Autenticación
0 / 5 lecciones
1
Flujo de login: formulario y JWT10 min
2
Flujo de registro: validaciones y onboarding8 min
3
JWT: cómo funciona la autenticación sin sesiones9 min
4
Refresh tokens: mantener la sesión activa de forma segura9 min
5
Roles y permisos: autorización en el frontend9 min
21
React Query
0 / 6 lecciones
1
¿Qué es React Query y por qué cambia todo?7 min
2
Queries: obtener datos con useQuery8 min
3
Mutations: modificar datos con useMutation7 min
4
Cache: la magia de React Query9 min
5
Infinite Queries: listas con paginación infinita7 min
6
Optimistic Updates: UI instantánea7 min
22
TypeScript con React
0 / 5 lecciones
1
Configurar TypeScript en un proyecto React9 min
2
Tipado de props: interfaces y tipos8 min
3
Tipado de estado, eventos y refs9 min
4
Tipado de respuestas de APIs9 min
5
Custom hooks con TypeScript9 min
23
Testing
0 / 5 lecciones
1
Vitest: testing moderno para proyectos Vite9 min
2
React Testing Library: testear como el usuario8 min
3
Testing de componentes React7 min
4
Testing de hooks con renderHook8 min
5
Mocking: simular dependencias en tests10 min
24
Optimización
0 / 5 lecciones
1
React.memo: evitar re-renders innecesarios8 min
2
useMemo en escenarios reales: cuándo importa7 min
3
useCallback en escenarios reales8 min
4
Lazy Loading: cargar componentes bajo demanda8 min
5
Code Splitting: optimizar el bundle para producción10 min
25
Arquitectura Profesional
0 / 5 lecciones
1
Organización de carpetas en proyectos React9 min
2
Arquitectura por features: escalar sin caos8 min
3
Separación de responsabilidades en componentes React8 min
4
Clean code en React: patrones y principios8 min
5
Preparar el proyecto para escalar8 min
26
Librerías UI
0 / 5 lecciones
1
Tailwind CSS avanzado: componentes y sistemas de diseño8 min
2
Material UI: componentes Google Design7 min
3
Shadcn/UI: el sistema de componentes moderno8 min
4
Chakra UI: accesibilidad y design system7 min
5
Radix UI: primitivos accesibles sin estilo8 min
27
Next.js
0 / 8 lecciones
1
Introducción a Next.js: React para producción8 min
2
App Router: el sistema de routing de Next.js 13+9 min
3
Server Components: renderizado en el servidor8 min
4
Client Components: cuándo usar 'use client'9 min
5
Server Actions: mutaciones del servidor8 min
6
SEO en Next.js: metadata y Open Graph7 min
7
SSR: Server Side Rendering con Next.js7 min
8
SSG: Static Site Generation8 min
28
Deploy
0 / 6 lecciones
1
Build de producción: optimizar y analizar11 min
2
Variables de entorno: desarrollo vs producción8 min
3
Deploy en Vercel: el flujo estándar7 min
4
Deploy en Netlify8 min
5
Deploy en Railway: apps full-stack9 min
6
Deploy en Render: la alternativa gratuita8 min
29
Proyecto Profesional
0 / 5 lecciones
1
Proyecto Final: definición, arquitectura y setup12 min
2
Proyecto Final: sistema de autenticación completo8 min
3
Proyecto Final: CRUD completo con React Query8 min
4
Proyecto Final: estado global y optimizaciones9 min
5
Proyecto Final: deploy y cierre del curso10 min