Curso Profesional de React Hooks

Curso Profesional de React Hooks

Instruido por:
Oscar Barajas Tavares
Oscar Barajas Tavares
Avanzado
6 horas de contenido
Ver la ruta de aprendizaje
Curso Profesional de React Hooks

Curso Profesional de React Hooks

Progreso del curso:0/45contenidos(0%)

Contenido del Curso
Tutoriales de estudiantes
Preguntas de estudiantes

Progreso del curso:0/45contenidos(0%)

¡Bienvenida! Este es un curso especial de React Hooks

Material Thumbnail

¿Qué aprenderás en el Curso Profesional de React Hooks?

01:01 min

Material Thumbnail

¿Qué son los React Hooks y cómo cambian el desarrollo con React?

05:32 min

Introducción a React Hooks

Material Thumbnail

useState: estado en componentes creados como funciones

11:23 min

Material Thumbnail

useEffect: olvida el ciclo de vida, ahora piensa en efectos

10:12 min

Material Thumbnail

useContext: la fusión de React Hooks y React Context

07:35 min

Material Thumbnail

useReducer: como useState, pero más escalable

09:06 min

¿Qué es memoization? Técnicas de optimización en programación funcional

04:10 min

Material Thumbnail

useMemo: evita cálculos innecesarios en componentes

11:43 min

Material Thumbnail

useRef: manejo profesional de inputs y formularios

04:03 min

Material Thumbnail

useCallback: evita cálculos innecesarios en funciones

04:48 min

Optimización de componentes en React con React.memo

07:18 min

Material Thumbnail

Custom hooks: abstracción en la lógica de tus componentes

07:12 min

Third Party Custom Hooks de Redux y React Router

02:01 min

Configura un entorno de desarrollo profesional

Material Thumbnail

Proyecto: análisis y retos de Platzi Conf Store

10:12 min

Material Thumbnail

Instalación de Webpack y Babel: presets, plugins y loaders

05:51 min

Material Thumbnail

Configuración de Webpack 5 y webpack-dev-server

17:01 min

Material Thumbnail

Configuración de Webpack 5 con loaders y estilos

05:48 min

Loaders de Webpack para Preprocesadores CSS

01:09 min

Material Thumbnail

Flujo de desarrollo seguro y consistente con ESLint y Prettier

11:11 min

Git Hooks con Husky

00:51 min

Estructura y creación de componentes para Platzi Conf Store

Material Thumbnail

Arquitectura de vistas y componentes con React Router DOM

12:46 min

Material Thumbnail

Maquetación y estilos del home

08:02 min

Material Thumbnail

Maquetación y estilos de la lista de productos

07:44 min

Material Thumbnail

Maquetación y estilos del formulario de checkout

04:55 min

Material Thumbnail

Maquetación y estilos de la información del usuario

08:33 min

Material Thumbnail

Maquetación y estilos del flujo de pago

04:05 min

Material Thumbnail

Integración de íconos y conexión con React Router

09:17 min

Integración de React Hooks en Platzi Conf Merch

Material Thumbnail

Creando nuestro primer custom hook

12:11 min

Material Thumbnail

Implementando useContext en Platzi Conf Merch

07:35 min

Material Thumbnail

useContext en la página de checkout

11:37 min

Material Thumbnail

useRef en la página de checkout

11:19 min

Material Thumbnail

Integrando third party custom hooks en Platzi Conf Merch

08:02 min

Configura mapas y pagos con PayPal y Google Maps

Paso a paso para conectar tu aplicación con la API de PayPal

01:59 min

Material Thumbnail

Integración de pagos con la API de PayPal

17:24 min

Material Thumbnail

Completando la integración de pagos con la API de PayPal

09:49 min

Paso a paso para conectar tu aplicación con la API de Google Maps

02:02 min

Material Thumbnail

Integración de Google Maps en el mapa de checkout

12:54 min

Material Thumbnail

Creando un Custom Hook para Google Maps

15:01 min

Estrategias de deployment profesional

Material Thumbnail

Continuous integration y continuous delivery con GitHub Actions

16:12 min

Material Thumbnail

Compra del dominio y despliega con Cloudflare

08:51 min

Optimización de aplicaciones web con React

Material Thumbnail

Integración de React Helmet para mejorar el SEO con meta etiquetas

09:02 min

Material Thumbnail

Análisis de performance con Google Lighthouse

03:43 min

Convierte tu aplicación de React en PWA

04:15 min

Bonus: trabaja con Strapi CMS para crear tu propia API

Material Thumbnail

Crea una API con Strapi CMS y consúmela con React.js

19:55 min

¿Qué sigue en tu carrera profesional?

Material Thumbnail

Próximos pasos para especializarte en frontend

01:40 min

nuevosmás votadossin responder
Luis Felipe Medina Rodriguez
Luis Felipe Medina Rodriguez
Estudiante

si uso sass y guardo todos en un global scss y lo meto al app.jsx esstaria bien?

1
Jorge Andres Mena Carcamo
Jorge Andres Mena Carcamo
Estudiante

Gente estaba ocupando react-hook-form y me di cuenta de que al momento de validar con una cantidad mínima de caracteres, al hacer espacio se puede evadir. Alguien sabe como agregar trim() a la validación?.

El código:

<labelhtmlFor="message">Message</label>
          <textarea
            {...register('message', {
              required: true,
              minLength: 10,
            })}
            name="message" id="message"
            rows="2"
            className={inputStyle}
            placeholder="Message"
          />
          {errors.message && (
            <spanclassName="input-error">
              You need to write at least 10 characters
            </span>
1
Nathan Red Blur
Nathan Red Blur
Estudiante

¿Que clase de problemas puedo tener si tengo muchos inputs sin usar ref?

1
Juan Jose Hernandez Garcia
Juan Jose Hernandez Garcia
Estudiante

El sidebar podría ser un componente, no?

0
Luis Fernando Méndez González
Luis Fernando Méndez González
Estudiante

Siempre me pregunto ¿Cómo puedo definir bien qué debe ser una dependencia de desarrollo y qué debe ser una dependencia normal?

0
Jorge Andres Mena Carcamo
Jorge Andres Mena Carcamo
Estudiante

Me gusta más ocupar props.children que destructurar directamente en el componente.
Pero el trabajar así me salió este error por concepto de eslint:
“Must use destructuring props assignment react/destructuring-assignment”

¿Alguien sabe alguna solución? ¡Gracias!

0
Campagna Javier Matias
Campagna Javier Matias
Estudiante

En donde dejó el plugin de VSCode con los shortcuts???

0
Carlos Andrés Norato Gómez
Carlos Andrés Norato Gómez
Estudiante

Hola tengo un pregunta con respecto al dark mode como yo puedo modificar el css de mi aplicacion desde la funcion que creamos en la anterior sesion.

A lo que me referio es que no tengo idea de como modificar o poner un estilo a mi sitio cuando le den el click.

0
Daniel Gurisatti Carrillo
Daniel Gurisatti Carrillo
Estudiante

Cual es el plug in que usa Oscar para que la terminal le recuerde cual fue el ultimo comando que utilizo ?

0
DAMIÁN NICOLAS PINEDO
DAMIÁN NICOLAS PINEDO
Estudiante

instale prettier de la misma manera que el profesor y cuando hago el archivo .prettier no lo reconoce lo toma como un txt, intente moviendo todas las dependencias a devDepen, pero aun asi no funcona ,alguna idea?

0