Envíanos tu consulta

Buscar cursos

Catálogo 2024-25

Cursos ¡Últimas plazas!Servicios FUNDAE Tutoriales Plataforma LMS

Solicitar información

Buscar cursos

Solicitar información

Formación

Modalidades

Próximas Convocatorias

Temario

FAQ

Solicitar información

Cursos de Desarrollo/Cursos de Desarrollo Web/Curso ReactJS + Talwind CSS + NextJS

Curso de ReactJS + Talwind CSS + NextJS

DISPONIBLE EN MODALIDAD:

Aula Virtual Personalizada

Empieza tu formación para crear aplicaciones de calidad con las librerías más famosas para el desarrollo web: ReactJS, Tailwind CSS y NextJS

Empieza tu formación para crear aplicaciones de calidad con las librerías más famosas para el desarrollo web: ReactJS, Tailwind CSS y NextJS. Mediante este curso podrás aprender a desarrollar aplicaciones web con ReactJS, aplicar estilos a través de Tailwind CSS y mejorar su distribución a través del server-side rendering que nos ofrece NextJS.

Formación en ReactJS + Talwind CSS + NextJS bonificable para empresas

A quién va dirigido nuestro curso de ReactJS + Talwind CSS + NextJS

- Desarrolladores web que desean profesionalizarse en la creación de aplicaciones web con ReactJS con Tailwind y en emplear server-side rendering gracias a NextJS.

Objetivos de nuestro curso de ReactJS + Talwind CSS + NextJS

Conocer los fundamentos de ReactJS y crear, mantener y publicar aplicaciones web reactivas y modernas.
Aplicar estilos a través de Tailwind CSS.
Conocer los fundamentos del server-side rendering a través de NextJS

Qué vas a aprender en nuestro curso de ReactJS + Talwind CSS + NextJS

Requisitos de nuestro curso de ReactJS + Talwind CSS + NextJS

Disponer de acceso a un usuario con permisos suficientes para realizar instalaciones.
Se recomienda tener NodeJS en su última versión LTS, NPM y Git instalados previamente en el equipo.
Se recomienda tener Visual Studio Code instalado previamente en el equipo.
Tener experiencia previa en JavaScript (ES6 en adelante), HTML, CSS y Git.
Se recomienda tener conocimientos de SASS / SCSS.

Temario del curso de ReactJS + Talwind CSS + NextJS

tema 1

Introducción a ReactJS

Qué es ReactJS
Ventajas principales
Instalación y puesta en marcha
Hola Mundo

tema 2

Componentes en ReactJS

¿Qué es un elemento?
¿Qué es un componente?
Componentes de Clase y Funcionales
Jerarquía y anidación de componentes
Componentes puros y componentes contenedor
Paso de información por props
PropTypes
No se modifica la vista… ¿Qué ocurre?
State Privado y las restricciones en su uso
¿Qué son los Hooks y por qué usarlos?
Introducción a los tipos de Hooks existentes
Hook useState
Gestión del ciclo de vida de un componente de clase
Gestión del ciclo de vida de un componente funcional
Herramienta React DevTools
Buenas prácticas

tema 3

Gestión de eventos en ReactJS

Gestión de eventos
Binding entre la vista y el controlador
Uso de Referencias en React
Hook useRef
Accediendo al valor de un elemento referenciado
Eventos de teclado
Eventos de ratón
Otros eventos
Buenas prácticas

tema 4

Hooks de interés de ReactJS

useEffect
useLayoutEffect
useContext
Aplicando hooks para ciclo de vida de componentes
useMemo
useCallback
useDebugValue
useImperativeHandle

tema 5

Sistema de enrutado en ReactJS

SPAs y las rutas
React Router
Definiendo las rutas
Obteniendo parámetros de la ruta
Paso de datos entre rutas
Redirección de rutas
Protegiendo las rutas
Navegación entre las rutas a través del historial de rutas
Navegación a rutas externas
Otras formas de navegar por la aplicación

tema 6

La gestión del estado global ReactJS

El estado de la aplicación
Problemática en React para persistir datos entre componentes
Introducción a Redux
Instalación y configuraciones previas
Herramienta Redux DevTools
Aplicación práctica para asentar los conceptos
Buenas prácticas

tema 7

Estados globales asíncronos en ReactJS

Alternativas Redux para gestionar la asincronía
Redux Sagas
Buenas prácticas de uso

tema 8

Gestión del estado con Hooks de ReactJS

¿Qué es la Context API?
Diferencias clave entre la Context API y Redux
Hook useContext
Estructuración del proyecto para utilizar el contexto
Trabajando con varios contextos y providers
Hook useReducer
Debate acerca de cuál es la solución más adecuada

tema 9

Testing en ReactJS

Introducción al testing
Diferencias entre Testing Unitario y Testing de Integración
¿Qué es el Shallow Testing?
Jest para testing en aplicaciones React
Configuración de Jest
Test Cases en Jest
Matchers de Jest
Spies de Jest
Mocking
Testing de componentes React
Tests de integración en React
Buenas prácticas
Breve introducción a metodología TDD
Breve introducción al testing funcional con Cypress

tema 10

Despliegue de la aplicación ReactJS

Introducción al despliegue de aplicaciones
Introducción a Netlify
Desplegando una aplicación React en Netlify
Despliegue continuo en Netlify

tema 11

Introducción a Tailwind CSS

Qué es Tailwind CSS
Ventajas principales
Instalación y puesta en marcha

tema 12

Tipografía en Talwind CSS

Tamaño y fuente
Colores y opacidad
Alineamiento y espaciado
Listas
Plugins

tema 13

Cajas en Tailwind CSS

¿Qué podemos incluir en las cajas?
Paddings y márgenes
Bordes
Colores de fondo
Imágenes de fondo
Altura y anchura

tema 14

Layouts de página en Talwind CSS

Contenedores
Posiciones
Z-index
Grids
Flexbox
Alineamiento de cajas

tema 15

Animaciones en Talwind CSS

Transiciones
Transformaciones

tema 16

Diseño responsive con Talwind CSS

Anchos de pantalla y breakpoints
Ocultar elementos en base al tamaño
Teniendo en cuenta las pantallas pequeñas
Teniendo en cuenta pantallas grandes

tema 17

Introducción a NextJS

Qué es NextJS
Ventajas principales
Instalación y puesta en marcha
Hola Mundo

tema 18

Fundamentos de NextJS

NextJS en desarrollo
NextJS en producción
Enrutado dinámico
Máscaras de rutas
Carga perezosa de componentes

tema 19

Configuración en NextJS

Páginas especiales
Configuraciones personalizadas
Configurando Webpack
Configurando Babel

tema 20

Flujo de datos en NextJS

Cargando datos de un servidor remoto con Next.js
Usando Redux
Usando GraphQL con Next.js para obtener datos
Usando Apollo framework con Next.js para obtener datos

tema 21

Ciclo de vida y lógica de negocio en NextJS

Autenticación
Listas de control de acceso, roles y permisos
Motor de reglas de negocio
Internacionalización y localización
Manejando errores
Catching
Analíticas

tema 22

Integración continua para NextJS

¿Qué es el despliegue automatizado?
Unit test
Test e2e (end-to-end)
Git hooks
Configuración de CI
Gitlab CI / Github Actions

tema 23

Uso de contenedores con NextJS

¿Qué es un contenedor?
¿Qué es Docker?
Configuración de Docker para NextJS
Despliegue
Buenas prácticas

Preguntas Frecuentes de ReactJS + Talwind CSS + NextJS

¿Cuáles son los beneficios del curso de ReactJS + Talwind CSS + NextJS?

El curso te permitirá dominar tres tecnologías clave en el desarrollo web moderno: ReactJS para aplicaciones frontend dinámicas, Tailwind CSS para estilización eficiente y NextJS para renderizado del lado del servidor y generación estática. Esto te ayudará a reducir tiempos de desarrollo y mejorar la performance y el SEO de tus aplicaciones.

¿El curso de ReactJS + Talwind CSS + NextJS se puede bonificar a través de FUNDAE?

Sí, el curso puede ser bonificado a través de la Fundación Estatal para la Formación en el Empleo (FUNDAE), lo que permite a las empresas recuperar parte o la totalidad del coste del curso.

¿En qué modalidades se imparte el curso de ReactJS + Talwind CSS + NextJS?

El curso se imparte en modalidad online y en aula virtual personalizada, ofreciendo flexibilidad para adaptarse a las necesidades y horarios de los participantes.

¿Qué habilidades desarrollaré con el curso de ReactJS + Talwind CSS + NextJS?

Desarrollarás habilidades avanzadas en el uso de ReactJS, Tailwind CSS y NextJS, incluyendo la creación de interfaces de usuario dinámicas, la aplicación de estilos de manera efectiva y la implementación de técnicas de renderizado del lado del servidor. También aprenderás a optimizar tus aplicaciones para mejorar su rendimiento y SEO.

¿Cómo puedo inscribirme en el curso de ReactJS + Talwind CSS + NextJS?

Puedes inscribirte en el curso rellenando los formularios que aparecen en la web. Este proceso es sencillo y te permitirá asegurar tu plaza en el curso de manera rápida.