Curso de React Avanzado

Clases del Curso de React Avanzado

Instruido por:
Miguel Ángel Durán
Miguel Ángel Durán
Avanzado
6 horas de contenido
Ver la ruta de aprendizaje
Petgram
Proyecto del curso
Petgram

Crea una aplicación para subir y compartir fotos de mascotas usando Webpack, GraphQL, React Hooks, React Router, SEO y PWAs.

Curso de React Avanzado

Curso de React Avanzado

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

Contenido del Curso
Tutoriales de estudiantes
Preguntas de estudiantes

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

Introducción al curso avanzado de React

Material Thumbnail

Bienvenida al curso y prerrequisitos

04:26 min

Material Thumbnail

Proyecto y tecnologías que usaremos

02:55 min

Preparando el entorno de desarrollo

Material Thumbnail

Clonando el repositorio e instalando Webpack

06:04 min

Material Thumbnail

Instalación de React y Babel

07:46 min

Zeit es ahora Vercel

00:23 min

Material Thumbnail

Linter, extensiones y deploy con Now

12:15 min

Creando la interfaz con styled-components

Material Thumbnail

¿Qué es CSS-in-JS?

03:30 min

Material Thumbnail

Creando nuestro primer componente: Category

09:06 min

Material Thumbnail

Creando ListOfCategories y estilos globales

10:10 min

Material Thumbnail

Usar información real de las categorías

03:42 min

Material Thumbnail

Creando PhotoCard y usando react-icon

11:11 min

Material Thumbnail

SVGR: de SVG a componente de ReactJS

05:34 min

Material Thumbnail

Creando animaciones con keyframes

06:41 min

Hooks

Material Thumbnail

¿Qué son los Hooks?

10:13 min

Material Thumbnail

useEffect: limpiando eventos

09:46 min

Material Thumbnail

useCategoriesData

06:32 min

Material Thumbnail

Usando Intersection Observer

10:47 min

Material Thumbnail

Uso de polyfill de Intersection Observer e imports dinámicos

07:30 min

Material Thumbnail

Usando el localStorage para guardar los likes

08:20 min

Material Thumbnail

Custom Hooks: useNearScreen y useLocalStorage

07:59 min

GraphQL y React Apollo

Material Thumbnail

¿Qué es GraphQL y React Apollo? Inicializando React Apollo Client y primer HoC

09:58 min

Material Thumbnail

Parámetros para un query con GraphQL

05:26 min

Material Thumbnail

Usar render Props para recuperar una foto

10:24 min

Material Thumbnail

Refactorizando y usando variables de loading y error

03:42 min

Material Thumbnail

Usando las mutaciones con los likes

09:34 min

Reach Router

Material Thumbnail

¿Qué es Reach Router? Creando la ruta Home

09:32 min

Material Thumbnail

Usando Link para evitar recargar la página

05:57 min

Material Thumbnail

Creando la página Detail

04:26 min

Material Thumbnail

Agregando un NavBar a nuestra app

07:44 min

Material Thumbnail

Estilando las páginas activas

04:22 min

Gestión del usuario

Material Thumbnail

Introducción a React.Context

08:59 min

Material Thumbnail

Creación del componente UserForm; y Hook useInputValue

08:41 min

Material Thumbnail

Estilando el formulario

06:09 min

Material Thumbnail

Mutaciones para registro

08:51 min

Material Thumbnail

Controlar estado de carga y error al registrar un usuario

05:31 min

Material Thumbnail

Mutaciones para iniciar sesión

05:25 min

Material Thumbnail

Persistiendo datos en Session Storage

07:33 min

Material Thumbnail

Hacer like como usuario registrado

09:47 min

Material Thumbnail

Mostrar favoritos y solucionar fetch policy

10:27 min

Mejores prácticas, SEO y recomendaciones

Material Thumbnail

Últimos retoques a las rutas de nuestra aplicación

06:10 min

Material Thumbnail

Midiendo el performance de nuestra app y usando React.memo()

10:38 min

Material Thumbnail

React.lazy() y componente Suspense

05:08 min

Material Thumbnail

Usando PropTypes para validar las props

11:25 min

Material Thumbnail

PWA: generando el manifest

08:40 min

Material Thumbnail

PWA: soporte offline

09:10 min

Material Thumbnail

Testing con Cypress

10:55 min

Conclusiones

nuevosmás votadossin responder
Daniela Salermi
Daniela Salermi
Estudiante

Hola comunidad si alguien me pudiera ayudar, porque en vez de usar esta librería no se define el scope del archivo scss con :local? Así podríamos tener las ventajas de usar scss sin pensar en la colisión de clases?

0
Yosef Enmanuel Blandin Rios
Yosef Enmanuel Blandin Rios
Estudiante

¿Cuales fueron las tecnologias usadas para crear el backend? Me gustaria poder crear otros para poder servir la informacion en mis proyectos

2
Matias Zurita
Matias Zurita
Estudiante

Hola tuve un error en la clase de mutaciones para registro
Screenshot_39.png
Screenshot_40.png
Screenshot_41.png

2
Yosef Enmanuel Blandin Rios
Yosef Enmanuel Blandin Rios
Estudiante

¿Como funcionan las query strings? Me dejaron volado jajaja

1
Anthony Torres Vargas
Anthony Torres Vargas
Estudiante

[ Linter, extensiones y deploy con Now 6/50 ]
cuando intento correr el comando npm run lint me sale este error, alguien sabe porqué? Captura.PNG

0
Jorge Arteaga
Jorge Arteaga
Estudiante

Alguien mas tiene problemas para instalar react-apollo con la version 17.0.2 de React?

1
Effren Anthony Peña Sánchez
Effren Anthony Peña Sánchez
Estudiante
Captura de Pantalla 2021-04-07 a la(s) 10.33.05.png

Alguien sabe cómo retirar esas barras de scroll? 😦

3
Victor Callegari
Victor Callegari
Estudiante

Esta alguien disponible para que me ayuden con un problema que estoy teninedo como mi react.state() porfavor?

1
Martín Roldán
Martín Roldán
Estudiante

Al pasar los props con el spread operator me quedaron algunas dudas.

  • ¿Se mandan al otro componente todos los props que contenga categories desde el json? ¿O solamente con describir en el archivo que quiero recibir los props cuales requiero, el spread operator manda solo esos?
0
Victor Callegari
Victor Callegari
Estudiante

Es una buena/mala idea combinar styled-components con makeStyles? Gracias!

0