React - Guía definitiva: hooks, router, redux, next + Proyectos

Una completa guía para el uso de la librería más popular en la actualidad.

ReactJS sin fronteras

Quieres aprender React moderno y las tecnologías más utilizadas en el mercado actual?

Este curso pretende entregarte todos los conocimientos necesarios para que puedas trabajar a nivel competitivo. Este curso es en su mayoría Hooks y componentes funcionales pero también incluye componentes basados en clases para que puedas mantener infraestructura existente en tu futuro trabajo si es que siguen utilizando clases (hay muchas empresas que aún los utilizan).

Cuenta también con multiples proyectos en varias secciones del curso para que puedas practicar todo lo que vamos aprendiendo y así reforzar en la memoria todos los conceptos aprendidos.

Además incluye una sección de nivelación en javascript con los conceptos necesarios para que puedas tener éxito con este curso, no es necesario que seas un experto en javascript, pero si que ya lo hayas experimentado y que tengas conocimientos básicos de programación.

Este curso es agnóstico del editor de texto por lo que podrás utilizar VS Code, Sublime Text, Vim, Atom o tu editor de texto o IDE favorito. Es más por favor úsalo y sácale partido!

Este curso está enfocado SOLAMENTE en react y su ecosistema, el objetivo es convertirte en un experto de React y no que veas miles de cosas que no tienen que ver con react!

Contenido del curso

1. 1 - Bienvenida
2. 2 - Como sacar el máximo provecho a este curso
3. 2 - Qué es react?
4. 4 - Como hacer preguntas y ruta de aprendizaje
1. 1 - Editores de texto recomendados
2. 2 - Instalando NodeJS
3. 3 - instalando git-bash
1. 1 - Entendiendo var, let y const
2. 2 - arrow functions
3. 3 - entendiendo import y export
4. 4 - clases parte 1
5. 5 - clases parte 2
6. 6 - spread operator parte 1
7. 7 - spread operator parte 2
8. 8 - rest operator con destructuring
9. 9 - metodos de arreglos- filter
10. 10 - metodos de arreglos- map
11. 11 - metodos de arreglos - reduce
12. 12 - fetch api
1. 3 - creando una nueva aplicación con create-react-app
2. 4 - analisis de la estructura del proyecto
3. 5 - Introducción a JSX
4. 6 - Componentes y propiedades
5. 7 - anatomía de un componente
6. 8 - inline style
7. 9 - Estilos con clases de CSS
8. 10 - Reutilizando componentes con estilos
9. 11 - componentes interactivos con onClick
10. 12 - renderizado condicional
11. 13 - Listas y sus keys
12. Resumen
1. 2 - Anatomía de un componente basado en clases
2. 3 - El state
3. 4 - Más sobre state
4. 5 - Cuando se renderiza un componente?
5. 6 - ciclo de vida
6. 7 - montando componentes
7. 8 - actualizando componentes
8. 9 - desmontando componentes
9. 10 - subiendo el estado
10. 11 - métodos y props
1. Código de la app
2. 1 - Que construiremos?
3. 2 - creando la aplicación
4. 3 - estado inicial y cargando imágenes
5. 4 - listando los productos
6. 5 - dando estilo a los productos
7. 6 - Botón para agregar al carro
8. 7 - componente de layout
9. 8 - Componente de título
10. 9 - Componente de navegación
11. 10 - Componente de Logo
12. 11 - Botón de carro de compra
13. 12 - Componente de bubble alert
14. 13 - agregando elementos al carro de compras
15. 14 - agregando elementos al carro de compras - parte 2
16. 15 - mostrando cantidad de elementos
17. 16 - mostrando el carro al usuario
18. 17 - mostrando el carro al usuario parte 2
1. 2 - Introducción a los componentes funcionales
2. 3 - useState
3. 4 - useState basado en clases?
4. 5 - primer custom hook
5. 6 - useEffect
6. 7 - useEffect desuscribirse
7. 8 - useEffect en clases?
8. 9 - useReducer
9. 10 - useRef
1. 1 - Introducción, componenentes no controlados
2. 2 - uncontrolled components, la forma de react
3. 3 - archivos en uncontrolled components
4. 4 - cuando usar uncontrolled components?
5. 5 - Introducción a controlled components
6. 6 - sincronizando multiples valores
7. 7 - componente de select
8. 8 - componente de checkbox
9. 9 - radio button
1. 1 - Que construiremos?
2. 2 - Primeros pasos y custom hook
3. 3 - Componente Input
4. 4 - Componente Card
5. 5 - Componente Container
6. 6 - Componente Button
7. 7 - Iterando los usuarios
8. 8 - Detalles finales
9. 9 - Problemas de rendimiento en formularios
10. 10 - Optimizando el rendimiento
1. 1 - Introducción a formik
2. 2 - Las propiedades del objeto formik
3. 3 - Agregando validaciones
4. 4 - Validar cuando se toque el campo
5. 5 - Eliminando código repetitivo
6. 6 - componente Formik
7. 7 - Componentes Field, Form y ErrorMessage
8. 8 - Las propiedades del componente Field
9. 9 - Componentes custom con el hook useField
10. 10 - Componente custom de Checkbox
11. 11 - Componente Select
12. 12 - Componente Radio
1. 1 - que vamos a construir
2. 2 - Header de la aplicación
3. 3 - Llamando a la API
4. 4 - iterando imágenes
5. 5 - dandole estilo al listado
1. 1 - Introducción
2. 2 - Instalación y funcionamiento
3. 3 - Composición de componentes
4. 4 - Adaptándose en base a las propiedades
5. 5 - Extendiendo estilos
6. 6 - Cambiando las etiquetas renderizadas
7. 7 - Agregando estilo a cualquier componente
8. 8 - Problemas de rendimiento
9. 9 - Pseudo elementos y selectores
10. 10 - agregando propiedades
11. 11 - Animaciones
12. 12 - Consideraciones de seguridad
1. 1 - Introducción
2. 2 - Creando un contenedor
3. 3 - Creando una tarjeta gris
4. 4 - Agregando los campos al formulario
5. 5 - Componente de Button y refactor
6. 6 - Formula de interés compuesto
7. 7 - Mostrando el balance
8. 8 - Validación de formulario
1. 1 - Introducción
2. 2 - Como funciona react?
3. 3 - Analisis de la aplicación
4. 4 - Memo
5. 5 - Que es memoization?
6. 6 - Memo con propiedad children
7. 7 - useCallback para memoizar funciones
8. 8 - Optimizando componente Title
9. 9 - useMemo
1. 1 - Introducción, que es context?
2. 2 - Primeros pasos
3. 3 - Actualizar el estado de un context
4. 4 - El problema de Context
5. 6 - Consumir multiples context
6. 5 - Context en componentes de clase
1. 1 - Introducción, que es react router?
2. 2 - Primeros pasos
3. 3 - Rutas anidadas
4. 4 - Rutas variables
5. 5 - NavLink
6. 6 - Componente Redirect
7. 7 - Error 404
8. 8 - Objeto history
9. 9 - useLocation
10. Resumen
1. 1 - Intro
2. 2 - Primeros pasos
3. 3 - Más ejemplos con redux
4. 4 - con react-redux
5. 5 - Una app más compleja
6. 6 - Agregando elementos al listado
7. 7 - Actualizando el elemento
8. 8 - Filtro de visibilidad
9. 9 - Dividiendo el código
10. 10 - middlewares
11. 11 - Típica acción asíncrona
12. 12 - Reducer para asincronía
13. 13 - Prácticas comunes
14. 14 - make reducer
15. 15 - reduceReducers
16. 16 - makeActionCreator
17. 17 - asyncMac y tipos asíncronos
18. Resumen
1. 01 - introducción
2. 02 - create-next-app
3. 03 - Estructura de la aplicación
4. 04 - Páginas, Link y code splitting
5. 05 - Rutas dinámicas
6. 06 - useIsMounted
7. 07 - Rutas dinámicas anidadas
8. 08 - Componente Image
9. 09 - contenido estático
10. 10 - Nueva ruta dinámica
11. 11 - agregando SSR a una página
12. 12 - un posible error con las rutas
13. 13 - Componente pokemon e imágenes fuera del dominio
14. 14 - como usar styled-components en nextjs
15. 15 - SSG dinámico
16. 16 - Creando un repositorio en github
17. 17 - Desplegando la app a vercel
1. 1 - Introducción
2. 2 - Configuración del entorno
3. 3 - Introducción al testing
4. 4 - Renderizando componentes
5. 5 - Probando componentes dinámicos
6. 6 - Test getStaticProps
7. 7 - Armando un componente con hooks
8. 8 - Probando el componente con hooks
9. Resumen

About this course

$19.90
193 lecciones
18 horas de contenido de video

Sucríbete a este curso

Empieza ahora

Buy Now