Udemy – React PRO: Lleva tus bases al siguiente nivel

Publicada el 30 noviembre, 20234 diciembre, 2023 por Administrador

Información

Descargar gratis el Curso React PRO Lleva tus bases al siguiente nivel de Udemy. Un excelente curso que pueden obtener totalmente gratis. Si el curso realmente les sirvió, apoyen al instructor comprando el curso como una manera de agradecimiento.

Storybook, Github Actions, publicar NPM, TypeScript, patrones de componentes, PWA, Formik, formularios dinámicos y más

Lo que aprenderás

Progresar como desarrolladores en React
TypeScript
PWAs manuales y con Workbox
Storybook
TSDX, Storybook y despliegues manuales a NPM
Github Actions
Versionamiento Semántico
Patrones de creación de componentes
Formik
Formularios dinámicos
Lazyload
Módulos
Re-utilización de componentes

Requisitos

Tener las bases de React con Hooks
Saber TypeScript es útil pero no indispensable (introducción incluída)
Poder realizar instalaciones en el equipo como administrador

Descripción

React Pro: Lleva tus bases al siguiente nivel

Bienvenidos a mi curso de React Pro, el objetivo principal es simple, mejorar tus habilidades existentes de React. No es un curso para personas que quieran empezar con esta librería, ya que el curso está dirigido a personas que ya tengan conocimientos de React con Hooks.

Breve Descripción del curso

El curso empieza con una breve introducción de React con Typescript, pero dejo videos adicionales en YouTube para mayor referencia (dichos videos creados por mi también y son 5 horas adicionales no incluidas aquí), luego pasamos a la creación de un pequeño proyecto que nos servirá para practicar diferentes patrones de creación de componentes, explicaré varios muy populares y poco a poco iremos creando un juego de componentes robusto que desplegaremos a NPM mediante TSDX. En el camino pasamos por separación de módulos y lazyload, adicionalmente doy mi punto personalizado preferido para trabajar con módulos.

Luego explicamos Formik, validaciones, Yup y formularios dinámicos, creando componentes re-utilizables simples que nos ayudarán a no tener que escribir lo mismo una y otra vez.

Posteriormente pasamos a Storybook, explicamos qué es, para que nos puede servir, creamos un par de configuraciones y luego publicamos nuestro Storybook en varios lugares, eventualmente crearemos los archivos de configuración de TypeScript necesarios, modificaciones en el package.json y configuraciones con semantic release para realizar todo un proceso sistematizado de creación y actualización de componentes utilizando GitHub Actions como intermediario.

Después nos movemos a levantar una aplicación realizada en mi curso de React de cero a experto que tiene un backend personalizado con JWTs, para transformar nuestra aplicación de React en una PWA, explicando configuraciones automáticas, manuales y personalizaciones que nos permitan trabajar sin conexión a internet nuestra aplicación de React, también instalarla como si fuera una aplicación de Windows, Linux o Mac.

Temas puntuales del curso:

El curso esta cargado de mucha información para mejorar nuestras habilidades de React, puntualmente estos son algunos temas de interés que tocamos en el curso:

React con TypeScript en un 95% del curso
Lazyload y Suspense
Rutas Hijas
Modularización
Git y GitHub para el manejo de ramas, versiones y acciones
Patrones de creación de componentes
1. Compound Components Pattern
2. Extensible Styles Pattern
3. Control Props Pattern
4. State Initializer Pattern
5. Function Child Pattern
6. Custom State Initializer + Function Child pattern
Despliegues a NPM
1. TSDX
2. Storybook to NPM
3. Despliegue manual a NPM: TypeScript + create-react-app
4. Semantic Release automático
Formik
1. Formularios tradicionales
2. Validaciones manuales
3. Validaciones con Yup
4. Custom Formik Hooks
5. Componentes de Formik
6. Formik Abstractation
7. Componentes personalizados reutilizables para Formik
8. Formularios dinámicos
9. Validaciones de formularios dinámicos
Storybook
1. Introducciones
2. Properties
3. Opciones
4. Elementos
5. Controles
6. Despliegues
7. Publicaciones a NPM
8. TypeScript
9. Documentación automática
10. Bonus: Chromatic
11. Bonus: Notas en Chromatic
GitHub Actions: El procedimiento a crear el siguiente
1. Configuración de acciones
2. Instalación de Node
3. Build de aplicacion de React
4. Creación de un versionamiento semantico
5. Generar Release
6. Publicación automática a Npm
7. Despliegue automático de Storybook
PWA:
1. Service Worker
2. Manifest
3. Configuraciones automáticas de npx create-react-app
4. Configuraciones manuales
5. Estrategias de caché
  1. Pre-cache
  2. Cache Only
  3. Cache first with network fallback
  4. Network first with cache fallback
  5. Network only
6. Offline mode
7. CRUD sin conexión
  1. Create
  2. Read
  3. Update
  4. Delete
8. Background Sync
Workbox
1. Configuración manual
2. Configuración con Wizard
3. Configuración preferida por mi (manual)
4. Background Sync
5. IndexedDB
6. Workbox CDN
7. Módulos de Workbox
React – Detectar online y offline

Nuevamente el curso tiene por objetivo pulir tus habilidades existentes de React con Hooks y llevarlas a un nivel superior para que tus aplicaciones de React sean aún mejores.

Espero el curso te ayude mucho y espero verte dentro del curso!