![](https://cdn.prod.website-files.com/64ac2a10ca05a003044df744/659d9216a8f488dff5e0146c_Frame%204.png)
Introducción a React
El taller «Introducción a React» está diseñado para principiantes y aspirantes a desarrolladores de front-end que desean iniciar su viaje al mundo de React.js. React se ha convertido en la piedra angular del desarrollo web moderno, ya que ofrece una forma potente y eficiente de crear interfaces de usuario dinámicas y con capacidad de respuesta. En este taller, los participantes emprenderán una exploración guiada de los conceptos básicos, la arquitectura de componentes y las herramientas esenciales de React. A través de una combinación de conferencias, ejercicios prácticos y aprendizaje basado en proyectos, los asistentes obtendrán una base sólida en el desarrollo de React y comenzarán a crear sus propias aplicaciones web interactivas.
Orden del día
Comprender los fundamentos de React
- Introducción a React y su papel en el desarrollo web moderno
- Conceptos clave: DOM virtual, JSX, componentes y administración de estados
- Descripción general del ecosistema y las herramientas de React (por ejemplo, Create React App, React Developer Tools)
Configuración de un entorno de desarrollo de React
- Instalación de Node.js y npm/yarn
- Crear un nuevo proyecto de React con la aplicación Create React
- Exploración de la estructura del proyecto y los archivos esenciales
Construyendo tu primer componente de React
- Anatomía de un componente de React: componentes de función frente a componentes de clase
- Escribir JSX para definir la estructura de los componentes y la interfaz de usuario
- Representación de componentes dentro del DOM mediante ReactDOM
Comprender el estado de React y los accesorios
- Introducción al estado de los componentes y los accesorios
- Administración del estado de los componentes con useState hook
- Pasar datos a los componentes mediante accesorios
Manejo de eventos en React
- El sistema de gestión de eventos de React
- Controladores de eventos vinculantes y argumentos de paso
- Actualización del estado de los componentes en función de las interacciones de los usuarios
Trabajando con listas y representación condicional
- Representación de listas de datos con el método map ()
- Representación condicional en React usando sentencias if y operadores ternarios
- Uso de la función key prop para una representación eficiente de las listas
Diseño de componentes de React
- Estilo en línea frente a CSS externo
- Uso de módulos CSS para estilos con alcance
- Explorando bibliotecas populares de CSS-in-JS para React
Introducción a React Router
- Configuración del enrutamiento del lado del cliente con React Router
- Creación de rutas, rutas anidadas y parámetros de ruta
- Navegar entre diferentes vistas en una aplicación React
Creación de una aplicación dinámica de React
- Integración de bibliotecas de administración estatal como Redux o useContext/UseReducer
- Obtención de datos de API externas mediante el gancho useEffect
- Creación de componentes de interfaz de usuario interactivos con React Hooks
Diseño responsivo con React
- Implementación de diseños adaptables mediante consultas de medios CSS
- Creación de interfaces de usuario aptas para dispositivos móviles con React
- Exploración de bibliotecas y marcos de diseño responsivos
Despliegue de su aplicación React
- Optimización de la aplicación React para la producción
- Creación de una compilación de producción con npm/yarn
- Implementación de aplicaciones React en plataformas de alojamiento populares (por ejemplo, Netlify, Vercel)
Al final del taller «Introducción a React», los participantes habrán adquirido una sólida comprensión de los fundamentos de React y las habilidades necesarias para crear aplicaciones web dinámicas y adaptables. Dispondrán de los conocimientos y la confianza necesarios para continuar su camino en el desarrollo de React y explorar temas y técnicas más avanzados para crear interfaces web modernas.