¡Bienvenida! Este es un curso especial de React Hooks

1

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

2

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

Introducción a React Hooks

3

useState: estado en componentes creados como funciones

4

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

5

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

6

useReducer: como useState, pero más escalable

7

¿Qué es memoization? Programación funcional en JavaScript

8

useMemo: evita cálculos innecesarios en componentes

9

useRef: manejo profesional de inputs y formularios

10

useCallback: evita cálculos innecesarios en funciones

11

Optimización de componentes en React con React.memo

12

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

13

Third Party Custom Hooks de Redux y React Router

Configura un entorno de desarrollo profesional

14

Proyecto: análisis y retos de Platzi Conf Store

15

Git Hooks con Husky

16

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

17

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

18

Configuración de Webpack 5 con loaders y estilos

19

Loaders de Webpack para Preprocesadores CSS

20

Flujo de desarrollo seguro y consistente con ESLint y Prettier

Estructura y creación de componentes para Platzi Conf Store

21

Arquitectura de vistas y componentes con React Router DOM

22

Maquetación y estilos del home

23

Maquetación y estilos de la lista de productos

24

Maquetación y estilos del formulario de checkout

25

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

26

Maquetación y estilos del flujo de pago

27

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

Integración de React Hooks en Platzi Conf Merch

28

Creando nuestro primer custom hook

29

Implementando useContext en Platzi Conf Merch

30

useContext en la página de checkout

31

useRef en la página de checkout

32

Integrando third party custom hooks en Platzi Conf Merch

Configura mapas y pagos con PayPal y Google Maps

33

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

34

Integración de pagos con la API de PayPal

35

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

36

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

37

Integración de Google Maps en el mapa de checkout

38

Creando un Custom Hook para Google Maps

Estrategias de deployment profesional

39

Continuous integration y continuous delivery con GitHub Actions

40

Compra del dominio y despliega con Cloudflare

Optimización de aplicaciones web con React

41

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

42

Análisis de performance con Google Lighthouse

43

Convierte tu aplicación de React en PWA

Bonus: trabaja con Strapi CMS para crear tu propia API

44

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

¿Qué sigue en tu carrera profesional?

45

Próximos pasos para especializarte en frontend

No tienes acceso a esta clase

¡Continúa aprendiendo! Únete y comienza a potenciar tu carrera

Próximos pasos para especializarte en frontend

45/45
Recursos

Aportes 33

Preguntas 5

Ordenar por:

¿Quieres ver más aportes, preguntas y respuestas de la comunidad?

Mis apuntes teóricos del curso
Espero que les sirva, hechos con 💚

Les comparto mi feedback del curso:

Puntos buenos:
-Me gusta el estilo de Oscar al explicar.
-Usamos muchas veces el useContext y useState que no me quedaron dudas de como implementarlo en otros proyectos.

  • Aprendí como linkear una sección con otra por medio de React Router (se necesita actualizar esta parte, ya cambió de manera considerable).
    Buen timing de los videos, no se hacen muy pesados.

Puntos a mejorar:
Seré un poco exigente en esta seccíón, y que al tratarse de una empresa establecida con gente y recursos, y no un freelancer, quedaron algunos puntos que no me terminaron de convencer o llenar por completo.

**Estructuración del curso:

  • Podrían empezar explicando el alcance del proyecto mostrando su versión final.
  • La explicación de los Hooks fue tan superficial que solo muestra la ejecución del Hook sin mostrar que está pasando, comparaciones, ejemplos a detalle, etc.
    -Muchos puntos lo dejan tan abiertos sin darse el tiempo de explicarlos (es un curso, vale la pena explicar los pequeños detalles). Ejemplo: podrían darse un minuto en analizar la data del objeto de un API, un video explicativo de como abrir cuenta en Paypal, etc.
    -Podrían explicar la arquitectura del proyecto en cada sección y luego empezar a escribir código. Muchas veces, durante el video, no sabía que se estaba haciendo sino hasta terminar la sección y decir: “Ahh, ya se que se hizo”, un pequeño esquema ayudaría mucho a ver el overview de hacia donde nos estamos dirigiendo.
  • Se nota mucha improvisación de la realización del curso (lo he notado también en otros cursos de esta plataforma).

Comento estos puntos ya que he tomado otros cursos en otras plataformas y educadores tech, que cuentan con mucho menor presupuesto y gente para la realización de cursos, y he quedado muy satisfecho con sus cursos.

Sé que pueden lograrlo, tienen la fama, el recurso económico y la gente. Solo falta un poco más de organización y planeación.

Los quiero 😃

Y luego dicen que Platzi solo tiene cursos básicos?. Este curso es de lo mejor que he visto en Platzi! Felicitaciones Oscar!

Que curso tan vacano. Muchas gracias oscar, exelente contenido y muy buena explicacion

Hi there, the React JS courses on Platzi were very helpful to finish my portfolio.
.
So I want to share the result julianmparra.com.
.
Finally, I appreciate all the support provided by the students and the teachers. Thanks

Dejo un resumen que hice espero que a alguien le sea util. ❤️

Excelente curso, tiene sus bachecitos porque ya es algo viejo, pero todo sale googleando y mirando lo que va diciendo la comunidad, gran curso!

mi deploy al final si pude usar strapi 😄
hambur-store

Muchas gracias por todo Oscar! Estuvo genial este curso, es genial practicar con ejemplos de situaciones reales.

finally!

Muy Buen curso!
hay algunos React hooks que falto profundizar pero excelente el proceso desde cero hasta montarlo en firebase

gran curso, super completo 😃

Este curso me explotó la cabeza muchas veces 🤯

Los invito a pasar por mi despliegue, ojala lo disfruten!
La API está servida por GCS.
Si encuentran algun bug haganmelo saber!
https://merchstore-85845.web.app/

Yo creo que la carpeta context más bien debería llamarse XProvider (donde X sería el nombre que represente la funcionalidad) y tu ThemeContext -> ThemeProvider para así exportarlo como un componente (provider) que recibe hijos, de esta manera el código queda más claro y limpio.

Un curso bastante completo en cuanto al uso React en proyectos más reales. Sin embargo, está desactualizado con respecto a webpack y las implementaciones de los paquetes de paypal y google maps.

excelente curso

Muy Completo el curso

no entendí lo de los issues…

Excelente curso! Muchas gracias Óscar!!!

Excelente curso!! Como siempre una muy buena explicación de parte de Oscar!! 💪🏻👌🏻

Excelente el curso profesional ++de errores ++ de React Hooks. Me encanta Oscar como profesor pero… me quedaron muchas cosas sin poder solucionar ya que el curso no está actualizado. Como por ejemplo no pude hacer andar la parte de PWA, nunca logré hacer que lea el manifest.json. Todo compilaba bien, y no encontré solución ya que tampoco conozco PWA en profundidad asique como era copiar y pegar y no nos explicaban mucho, no pude resolver el problema. Aprendí mucho? Siii, pero aprendí de que cada video me salia un error mas raro que el otro y tardaba horas en poder resolverlo. Asi que voy a seguir profundizando en los cabos que quedaron sueltos, pero creo que ya es hora de una ACTUALIZACIÓN del curso.
Mas allá de eso, me encanta Oscar como profesor!

Gracias Oscar!!! Eres el mejor

Mil gracias Oscar super completo el curso 😄

Muchas gracias. Excelente curso.

Que buen curso, muchas gracias

Excelente Curso Oscar, muy completo

Grande Oscar!! muchas gracias por este icreible curso

Grandioso curso, supero mis expectativas
Les dejo esta publicación para aquellos que quieran usar las credenciales de las APIs de PayPal y Google como variables de entorno:
https://platzi.com/tutoriales/2118-react-hooks/8661-como-usar-variables-de-entorno-en-el-proyecto-platzi-conf-merch-localmente-y-en-produccion/

https://platzi.com/r/christianfer/
Obtén 1 mes gratis adicional con la compra de tu suscripción con mi link. Así además, me ayudas a obtener también 1 mes gratis, así podemos aprender los 2!
Agradecería mucho tu ayuda, ya que la situación en Venezuela no me da muchas posibilidades.

Super bueno el contenido, muchas gracias Oscar!

a

El link esta roto