React y TypeScript - La Guía Completa Creando +10 Proyectos

Aprende React desde cero: Hooks y State hasta TypeScript, Zod, Zustand, React Query, Next.js IA React Router MERN y PERN

$9.99 (93% OFF)
Get Course Now

About This Course

<div>Aprende React con TypeScript paso a paso creando proyectos del mundo real.</div><div><br></div><div>El único curso en Udemy que enseña React con proyectos del mundo real; Incluso si tus bases de JavaScript no son muy fuertes el curso tiene una introducción con todo lo que debes saber.</div><div><br></div><div>¿Quisiste aprender React y solo te aprendiste los nombres de los Pokemon? entonces este curso es para ti.</div><div><br></div><div>En este curso aprenderemos a crear proyectos reales abarcando todo el ecosistema de React: State, Hooks, crear tus propios hooks, hooks avanzados, estado global, componentes y eventos, consultar API's externas y crear tus propias API's</div><div><br></div><div>Todos los Proyectos incluyen TypeScript desde el inicio.</div><div><br></div><div>Proyecto 01: Carrito de compras.- En este proyecto estaremos aprendiendo los fundamentos de React: Componentes, Eventos y State, mientras creas un carrito de compras real con cantidades, precios, y más, tomaremos este mismo carrito para mostrarte como crear tus propios Hooks y como transformarlo a código de TypeScript y cuales son sus beneficios.</div><div><br></div><div>Proyecto 02: Calculadora de Propinas y Consumos: Un proyecto ideal para restaurantes donde se podrá generar una orden con consumos y la persona podrá elegir la propina que desea dejar.</div><div><br></div><div>Proyecto 03: Contador de Calorias y Ejercicios: Una de las tareas que más vas a realizar en tu vida como Developer es procesar formularios; en este proyecto tendremos un formulario, leeremos sus datos, lo vamos a procesar y realizar algunas operaciones como validación y mucho más, además aprenderás que es useReducer para manejar estados complejos en tus apps.</div><div>Proyecto 04: Migrar Carrito de Compras a useReducer: En este capítulo estaremos viendo como tomar el proyecto de carrito de compras y convertirlo hacia useReducer; cuando tomas un proyecto que conoces en una tecnología nueva es garantía que podrás entender mejor los conceptos.</div><div><br></div><div>Proyecto 05: Migrar Calculadora de Propinas hacia useReducer: Veamos como migrar nuestro otro proyecto hacia useReducer.</div><div><br></div><div>Proyecto 06: Control de Gastos y Presupuestos: En este proyecto estaremos viendo que es Context API para tener un estado global sin dependencias; Context API va a ayudarte a no pasar props por cada componente, completamos el curso con filtrar gastos por categoría, calendario de fechas de gastos, gráficas y mucho más!</div><div><br></div><div>Proyecto 07: Administrador de Pacientes: Este proyecto añade 2 herramientas nuevas: Zustand para manejar un estado global de forma muy simple y React Hook Form, una librería para tener validación y procesamiento en formularios de forma bastante sencilla.</div><div><br></div><div>Proyecto 08: Aplicación de Clima: Esta será nuestra primera aplicación que obtiene datos de una API, como React Developer vas a trabajar en muchos proyectos que incluyen API's; estaremos viendo como validar y enviar peticiones hacia API, como leer las respuestas y como mostrar esa información.</div><div><br></div><div>Proyecto 09: Cotizador de Criptomonedas: Este proyecto al igual que el anterior se conecta a una API para obtener el precio de una Criptomoneda en dolares, pesos mexicanos y otras monedas; Este proyecto incluye Zustand y Zod para validar las respuestas que obtenemos de nuestra API.</div><div><br></div><div>Proyecto 10: Buscador de Recetas: Este es nuestro primer proyecto que incluye múltiples páginas; lo estaremos realizando con React Router DOM la librería más popular para crear aplicaciones en React de múltiples página, este curso utiliza el Slice Pattern para tener múltiples Stores de Zustand!</div><div><br></div><div>Proyecto 11: Administrador de Productos: Este es nuestro primer proyecto Full Stack donde estaremos creando tanto frontend como backend utilizando el PERN (PostgreSQL, Node.js, Express y React) este proyecto utiliza una REST API que conectaremos con React, añadiremos temas más avanzados como Testing y Documentación de API's.</div><div><br></div><div>Proyecto 12: Administrador de Tareas y Proyectos:&nbsp; Este es el Proyecto más avanzado del curso, utiliza el MERN stack que es uno de los más populares hoy en día, este proyecto incluye un sistema robusto de autenticación y registro de usuarios con confirmación de cuentas y resetear el password en caso de olvidarlo; además incluye roles y los usuarios solo pueden realizar ciertas acciones. El curso incluye además una REST API bastante compleja y avanzada, El curso utiliza también React Query, Tailwindcss, React Router, Mongoose, Express, TypeScript y mucho más.</div><div><br></div><div>Proyecto 13: Quiosco de Comida: Finalizaremos este curso con una introducción a Next.js, utilizaremos la versión 14 con App Router, Server Actions, Prisma, Zod, Zustand, Tailwind, y mucho más, el proyecto incluye subida de archivos, CRUD Completo, paginador, buscador y más.</div>

What you'll learn:

  • En pocas palabras: Desde useState hasta Nextjs 14 con Server Actions
  • Aprenderás a crear y manejar proyectos con React
  • Aprenderás los hooks más utilizados useEffect, useState, useMemo, useCallback, useReducer y más
  • Aprenderás a crear tus propios hooks
  • Aprenderemos a utilizar TypeScript con React
  • Utilizar Context API para un estado global sin dependencias
  • Aprenderás Zustand para manejar el estado global fácilmente
  • Consumir API's externas en React
  • Integrar Tailwind a tus proyectos
  • React hook form la librería más popular para formularios en React hoy en día
  • Aprenderemos Zod para validar las respuestas de nuestras api's y darles consistencia
  • Headless UI para crear diseños interactivos en Tailwind
  • React Router DOM para tener proyectos con múltiples páginas
  • Stack de PERN y MERN
  • Crear aplicaciones FullStack con React TypeScript y Express
  • Agregar Roles con Express
  • Autenticación en aplicaciones React
  • Autorización en React
  • React Query para peticiones con gran performance
  • Next14 con App Router
  • Server Actions en Nextjs
  • Aprenderás Prisma y Next
  • Sequelize y Mongoose para los proyectos FullStack