Curso de React Programming

Precio

El precio de este curso es de 21 UF por alumno.

Curso de React Programming en 2022, presenta el marco React JavaScript, a veces denominado ReactJS o React.JS. El curso React Programming proporcionará una introducción a los beneficios del marco de JavaScript de React, para que los participantes puedan comenzar a desarrollar aplicaciones rápidamente utilizando el marco.

React es una biblioteca de JavaScript que simplifica la creación de interfaces de usuario sin esfuerzo. Fue desarrollado por Facebook, que lo mantiene junto con una comunidad de desarrolladores. Dado que las interfaces de usuario se utilizan en casi todas las aplicaciones web, la capacidad de desarrollar interfaces de usuario de manera más eficiente es crucial. React hace exactamente esto al proporcionar una forma amigable para los desarrolladores de crear interfaces de usuario personalizadas.

Objetivos del Curso de React Programming :

En esta clase de React Training, los asistentes aprenderán cómo:

  • Comprender el modelo de programación proporcionado por el marco React
  • Definir componentes de React
  • Use el marco React para manejar eventos y datos con estado

Requisitos previos para la capacitación en programación de React

Los asistentes a este curso de React Training deben tener conocimientos previos de desarrollo web, HTML, AJAX, JavaScript y ES6 o superior.

Duración del Curso de React Programming

24 horas en Formato Online.

Esquema de la programación React en 2021

Módulo 1. Descripción general del Curso de React Programming

  •  ¿Qué es React?
  • Qué hay en un Name?
  • Modelo de componentes de react
  • Lo que no es React
  • Todo lo que no encontrarás en React
  • Motivación para crear React
  • Un ejemplo de React JavaScript
  • Flujo de datos unidireccional
  • JSX
  • Un ejemplo JSX
  • El DOM virtual (simulacro)
  • Solo se vuelven a renderizar los subcomponentes que realmente cambian
  • Bibliotecas de React
  • Resumen

Módulo 2. ES6 en pocas palabras

  • ¿Qué es ES6?
  • Características de ES6
  • Uso de ES6
  • Transpiling
  • Cambios importantes de sintaxis
  • let y const
  • Alcance variable
  • Variables de sombreado
  • Funciones de flecha
  • Algunas funciones de flecha como parámetros
  • Usar 'esto' dentro de las funciones de flecha
  • Literales de plantilla
  • Operador de propagación
  • Clases ES6
  • Declaración de clases
  • Declaración de métodos de instancia
  • Métodos de acceso
  • Métodos Estáticos
  • Herencia con clases
  • Resumen

Módulo 3. Interfaz de línea de comandos de Babel

  • Babel transpiler
  • Opciones de uso
  • Ajustes preestablecidos y complementos
  • Instalación de la CLI de Babel
  • Configuración de Babel
  • Ejecución de la línea de comandos de Babel
  • Una configuración básica de desarrollo de ES6 con Babel
  • Probar la configuración de desarrollo de Babel
  • Agregar React a la configuración de desarrollo
  • Crear una aplicación Minimal React – Index.html
  • Crear una aplicación Minimal React: app.js
  • Resumen

Módulo 4. Curso de React Programming: Componentes básicos y JSX

  • ¿Qué es JSX?
  • Transpilación JSX para ejemplo de código React
  • Ejecutar el código transpilado
  • Babel
  • La biblioteca JavaScript de tiempo de ejecución de Babel
  • Código de esqueleto de importación de secuencias de comandos
  • Jugando en CodePen
  • Componentes de reacción
  • Formas de crear componentes de interfaz de usuario
  • Creación de un ejemplo de componente funcional
  • Los nombres de los componentes deben estar en mayúscula
  • Creación de un componente basado en clases de React en ES5
  • El método de renderizado
  • Creación de un componente de interfaz de usuario utilizando la notación de clase ES6
  • Uso de clases ES6 con React
  • ¿Qué sintaxis de creación de componentes de interfaz de usuario debo usar?
  • Componentes vs Elementos
  • Los elementos son inmutables
  • Propiedades
  • Convención de nomenclatura de propiedades
  • Propiedades predeterminadas en 'Verdadero'
  • Atributos extendidos (una característica de ES6)
  • Expresiones
  • Fragmentos
  • Resumen

Módulo 5. Conceptos de componentes funcionales de React

  •  Componentes funcionales
  • Anidamiento de elementos JSX
  • Ejemplo de anidamiento JSX
  • Comentarios en código JSX
  • Configuración de estilos CSS mediante clases
  • Establecer estilos CSS directamente
  • Valores de escape JSX
  • Trabajar con listas de elementos
  • Teclas en Listas
  •  Lista de ejemplo con clave
  • Contenedor frente a componentes de presentación
  • Estado
  • Tipos de estados de datos
  • Jerarquía de estados
  • Estado de elevación
  • Props vs Estado
  • Pasar una función
  • Inmutabilidad
  • Inmutabilidad - ¿Por qué?
  • DOM virtual y estado
  • Estado de configuración
  • Actualización de campos de entrada
  • Pasar accesorios a componentes
  • Pasar Funciones a Componentes
  • Gestión de eventos
  • Ejemplo de controlador de eventos
  • Vinculación de eventos: DO
  • Vinculación de eventos: no hacer
  • Pasar parámetros a controladores de eventos
  • Ciclo de vida del componente
  • Ciclo de Vida en Componentes Funcionales
  • Flujo de trabajo de desarrollo de aplicaciones: 1/3
  • Flujo de trabajo de desarrollo de aplicaciones: 2/3
  • El flujo de trabajo de desarrollo de aplicaciones: 3/3
  • Resumen

Módulo 6. Componentes React con clases ES6

  •  Clases en ES6
  • Componentes funcionales
  • Ampliación de React.Component
  • El método render()
  • Estado
  • Accesorios
  • Accesorios predeterminados
  • PropTypes
  • Ciclo de vida del componente
  • Ciclo de vida del componente: descripción general
  • El ciclo de vida del componente: fase de renderizado
  • Ciclo de vida del componente: fase de compromiso
  • Y el ciclo de vida del componente: desmontaje
  • constructor()
  • ejemplo
  • componenteDidMount()
  • ejemplo
  • setState( newStateValue )
  • Resumen

Módulo 7. Enrutador React

  • Enrutamiento y Navegación
  • enrutador de react
  • Creación de un proyecto basado en un enrutador de react
  • Un componente enrutado básico
  • Enrutador frente a navegadorRouter
  • El componente Ruta
  • <Interruptor>
  • Redirigir ruta
  • Navegación con <Enlace>
  • La navegación con <NavLink>
  • Parámetros de ruta
  • Recuperación de parámetros de ruta
  • Parámetros de cadena de consulta
  • Uso del enrutador con Redux
  • Resumen

Módulo 8. Gestión de estado para React

  •  Conceptos básicos de React State: accesorios y estado
  • Accesorios
  • Componentes basados ​​en estado en clase
  • Gestión de estado con ganchos en componentes funcionales
  • El problema con los apoyos y el estado
  • Biblioteca de estados Redux
  • Ventajas de Redux
  • Desventajas de Redux
  • Reglas Básicas para la Gestión del Estado
  • Tipos de estado
  • Estado de datos
  • El estado de la comunicación
  • Estado de control
  • Estado de la sesión
  • El estado de la ubicación
  • Efectos secundarios del estado de la ubicación
  • Resumen

Módulo 9. Curso de React Programming: Uso de ganchos de react

  • Deficiencias de componentes funcionales
  • Descripción general de los ganchos
  • Accesorios de componentes funcionales
  • El gancho useState
  • Componente funcional usando el gancho useState
  • useState con múltiples variables
  • useState también se puede usar con objetos
  • El gancho de efectos
  • Ejemplo de gancho de efecto
  • Uso del gancho de efectos para cargar datos
  • Restricción cuando se llama a useEffect
  • Reglas de gancho
  • Ejemplo de linte
  • Ganchos personalizados
  • Ejemplo de función de gancho personalizado
  • Uso del gancho personalizado
  • Ganchos adicionales
  • Resumen

Módulo 10. Pruebas unitarias React con React Testing Library

  • Marco de prueba de reacción
  • Características
  • Pruebas de instantáneas
  • Cobertura de código
  • Modo interactivo
  • Proyectos creados
  • crear-react-aplicación
  • Prueba de componente de aplicación predeterminada
  • Pruebas unitarias
  • Anatomía de una prueba unitaria
  • Coincidencias comunes
  • Combinación de pruebas
  • Ejecución de pruebas
  • Prueba de código asíncrono basado en Promise con 'done'
  • Montaje y desmontaje
  • biblioteca de pruebas de reacción
  • Una prueba de componente simple
  • Una prueba de instantánea simple
  • Ejecución y actualización de pruebas SnapShot
  • Pruebas de componentes de construcción
  • Procesamiento de llamadas
  • Propiedades de procesamiento
  • Simulación de eventos
  • Resultados de las pruebas
  • Uso de funciones de consulta
  • Coincidencia de texto
  • Componente de contador
  • Ccontra-prueba.js
  • Resumen

Ejercicios de laboratorio del Curso de React Programming

  • Laboratorio 1. Configuración de un entorno de desarrollo de React
  • Lab 2. Componentes básicos de React
  • Laboratorio 3. Más conceptos de componentes de React
  • Lab 4. Componentes de ES6 React
  • Laboratorio 5. Aplicación React Router
  • Lab 6. Aplicación React Hooks
  • Laboratorio 7. Proyecto del curso: aplicación React con ganchos

 

Otros Cursos y Seminarios de Capacitación

Capacitacion oracle db ii 2

Administración Oracle DB: Workshop II

Es un curso oficial de Oracle Education que está diseñado para llevar al administrador de la base de datos más allá de las tareas básicas tratadas en el primer taller. El estudiante obtendrá un conocimiento más profundo del que posiblemente es el trabajo más importante de un DBA... Ver más

Capacitacion oracle data guard

Administración Oracle Data Guard

Es un curso oficial de Oracle Education que está diseñado para entrenar al DBA a entender la arquitectura de procesos asociados a Data Guard, y como implementar Active Data Guard y Standby Data Guard. Este curso entrenará y ayudará al alumno a desarrollar las habilidades necesarias... Ver más

Capacitacion modelamiento datos

Modelamiento de Datos

Este curso tiene como objetivo principal que los alumnos dominen los conceptos de Modelamiento de Datos abarcando todo el proceso de diseño, construcción e implementación de una Base de Datos Relacional incluyendo elementos de Inteligencia de Negocios... Ver más

Capacitacion modelamiento bizagi

Modelamiento de Procesos con Bizagi

Este curso proporciona las herramientas necesarias para emprender el levantamiento de procesos de negocio en una organización. Estas herramientas serán el apoyo fundamental para iniciarse en el mundo de la gestión de procesos y de esta forma iniciar el proceso de mejora continua... Ver más