Estudiante: Modalidad para estudiantes pre-grado universitarios o institutos. Adjuntar foto de carnet vigente o boleta de matrícula.
Estudiante: Modalidad para estudiantes pre-grado universitarios o institutos. Adjuntar foto de carnet vigente o boleta de matrícula.
¡Especialízate en Front-End con JavaScript, UX/UI y React Native para crear páginas web sólidas y móviles optimizadas!
Duración: 18 sesiones
Modalidad: Transmisión en vivo vía Microsoft Teams
Reserva tu vacante: con s/250 - Cuota inicial
¿Qué aprenderás en nuestra Especialización?
En nuestra Especialización en Desarrollo Front End, desde básico a avanzado, lograrás:
Desarrollar webs robustas que sirvan de impulso para tu negocio o emprendimiento
Aprender a documentar procesos y colaborar con otros programadores en proyectos laborales reales
Gestionar el diseño UX/UI que facilite la navegabilidad interacción y experiencia del usuario
Manejar Javascript y sus bibliotecas, las herramientas más solicitadas en desarrollo web
Manejar React Native para desarrollar aplicaciones móviles multiplataforma
¿Por qué llevar el programa?
Esta especialización de desarrollo Front End te proporcionará un conjunto completo de herramientas para sobresalir en el mundo del desarrollo FrontEnd. Abarca desde la creación de sitios web con HTML y CSS hasta el desarrollo avanzado de aplicaciones web y móviles con React. Con esta especialización podrás:
Dominar todo el ecosistema web desde el diseño visual hasta la programación funcional
Maximiza tu empleabilidad: Los desarrolladores multiplataforma, que dominan tanto la web como el desarrollo móvil, son altamente buscados. En 2023, hubo un incremento del 35% en las vacantes para estos perfiles.
Competir globalmente: Con GitHub y React, estarás listo para colaborar en proyectos internacionales o aplicar en empresas líderes como Google o Amazon, que constantemente requieren profesionales con estas habilidades.
Amplía tu versatilidad: La combinación de herramientas te permitirá trabajar tanto en proyectos pequeños como en sistemas a gran escala, abriendo más oportunidades en el mercado tecnológico en constante evolución.
Docentes
Director de Tecnologia en APPU
Especialista en el diseño y programación en web. Ingeniero industrial con conocimientos en desarrollo Full Stack, desarrollo de software y gestión de proyectos digitales. Ejecutivo con más de 9 años en el desarrollo de soluciones y dirección de proyectos tecnológicos en empresas como APPU, NETIC, DIABECARP, LAND GORILLA, entre otras.
Desarrollador Front End & Docente en ISIL
Especialista en Branding Corporativo y Desarrollo Front End. Licenciado en Diseño Gráfico por la PUCP, con una Maestría en Innovación y emprendimiento, con conocimientos en desarrollo web responsivo, diseño UX/UI, Design Thinking y Metodología Activa. Docente con más de 15 años de experiencia en programas de diseño y desarrollo web en instituciones como la PUCP, IDAT, Cibertec, Toulouse Lautrec e ISIL.
Full Stack Developer Senior en WinWinAfi
Especialista especializado en el desarrollo de páginas web y comercio electrónico. Ha trabajado en proyectos destacados dentro de la industria, creando tiendas virtuales para reconocidas marcas como Yamaha, Kawasaki y BackusYa, en colaboración con Samishop, una empresa líder en comercio. Profesional con más de 10 años de experiencia en desarrollo Frontend, Fullstack y TI en empresas como Samishop, WinwinAfi, entre otras.
a nombre de WE Educación Ejecutiva con 30 horas académicas, avalado por Microsoft Partner Network.
a nombre de WE Educación Ejecutiva por 90 horas académicas, avalado por Microsoft Partner Network
a nombre de WE Educación Ejecutiva por 30 horas académicas, avalado por Microsoft Partner Network
a nombre de WE Educación Ejecutiva con 30 horas académicas, avalado por Microsoft Partner Network
Sesión 1: MAQUETADO E INTERFAZ CON HTML
El nuevo perfil del programador web
Análisis de las necesidades del cliente para desarrollo web
Optimizando estructuras web: Visual Studio Code
Propiedades y aplicaciones de CSS
Caso 1: Uso de plantillas para el diseño web
Taller 1: Definiendo la estructura de tu primera página web
Sesión 2: DISEÑO INICIAL DE INTERFAZ WEB
Implementando CSS en desarrollo web
Inserción de imágenes en HTML
CSS: aplicación de modelo BOX Modeling
Propiedades CSS avanzadas
Implementando vínculos en tu página web
Caso 1: Inserción de imágenes en tu estructura web
Taller 1: Desarrollo de tu prototipo de página web
Sesión 3: RECOPILACIÓN DE INFORMACIÓN CON FORMULARIOS WEB
Botones de control web
Elementos de la web: Campos y desplegables
Diseño y manejo de formularios
Aplicaciones de propiedades CSS
Caso 1: Aplicando controles efectivos y campos desplegables
Taller 3: Diseño de interacciones en tu página web
Sesión 4: DISEÑO ADAPTABLE A DISPOSITIVOS DE USUARIOS
Modelo de caja, flujos y posicionamiento
Aplicaciones con Flexbox
Grids I
Grids II
Caso 1: Programación de diseños web responsivos
Taller 4: Adaptando tu página web a diversos dispositivos
Sesión 5: CONTROL EFECTIVO DE PROGRAMACIONES WEB
Overview y aplicaciones en GIT
Control de versiones: Conociendo Git Hub
Verificación del rendimiento de la web
Optimización del código web
Caso 1: Manejar y compartir versiones de proyecto con Git Hub
Taller 5: Optimizando el funcionamiento de tu página web
Sesión 6: APLICACIONES DE FRAMEWORKS DE CSS
Frameworks más empleados en programación web
Bootstrap
Integración de framework con sistemas de diseño
Integración de Bootstraps con SASS
Caso 1: Mejora de código web con Bootstrap y SASS
Taller 6: Automatización de framework en páginas web
Sesión 1: CONCEPTOS BÁSICOS DE JAVASCRIPT
Javascript en la programación web
Sintaxis de Javascript
Tipos de variables
Tipos de operadores
Integración básica con HTML
Consola visual studio code
Caso 1:Identificación de errores con la consola de VSC
Taller 1: Creando un contador visitas para tu página web
Sesión 2: CONDICIONALES Y BUCLES
If y Else
Operador temerario
Switch
For y While
Funciones condicionales
Caso 2: Aplicación de condicionales anidadas
Taller 2: Sistema de recomendación dinámica con condicionales
Sesión 3: OBJETIVOS Y ARRAYS
Objetos
Arrays
Funciones complejas
Bucles con objetivos y arrays
Arrow Functions
Caso 3: Extracción y operaciones con datos de arrays
Taller 3: Agregar una galería de imágenes a tu web
Sesión 4: JAVASCRIPT DOM EN HTML
¿Qué es DOM?
Relación con estructura web
Acceso a elementos HTML
Manipulación de contenidos HTML
Eliminación de elementos HTML
Caso 4: Manipulación de cuadros de texto con HTML
Taller 4: Modifica contenido web en tiempo real
Sesión 5: JAVASCRIPT DOM EN CSS
Selección de elementos CSS
Cambios de estilo CSS
Recordatorio Flexbox y Grid
Flexbox CSS dinámico
Grid CSS interactivo
Caso 5: Cambio interactivo de colores con CSS
Taller 5: Modifica los estilos de tu web en tiempo real
Sesión 6: EVENTOS DOM EN WEB
Eventos de click
Eventos de teclado
Eventos de ventana
AddEventListener
Integración de eventos
Caso 6: Funciones de arrastre con el mouse
Taller 6: Crea un task manager dentro de tu web
Sesión 1: INTRODUCCIÓN A REACT JS Y COMPONENTS
React en la ruta del programador
Estructura del framework React
Introducción de componentes
Instalación y creación de componenetes
Manejo de componentes con useState
Manejo de efectos con useEffect
Caso 1: Gestionar y actualizar variables con React Js
Taller 1: Crea tarjetas de presentación personalizadas con componentes reutilizables
Sesión 2: RENDERING EN REACT JS
Rendering en React
Renderizado condicional
Desarrollo de formularios
Control de estados
Caso 2: Renderizado de elementos en navegación
Taller 2: Renderiza listas de productos actualizable con React Js
Sesión 3: ROUTING Y NAVEGACIÓN REACT JS
Fundamentos de React Router
Manejo de eventos en React
Componentes de routing y navegación
Rutas y componentes
Redirecciones en navegación
Caso 3: Navegación entre componentes con React Router
Taller 3: Usa React Router para crear secciones en tu página web
Sesión 4: FUNDAMENTOS DE REACT NATIVE
Relación entre React JS y Native
Introducción a React Native
Componentes React Native: View, text, image, button
Estilos en React native
Flexbox en React native
Caso 4 : Ejemplos de aplicaciones de React Native
Taller 4: Realiza tu primera aplicación móvil utilizando React Native
Sesión 5: REACT NAVIGATION
React navigation
UseState para componentes native
UseEffect para efectos native
Almacenamiento con AsynStorage
Caso 5: Traslado de funciones React Js a React Native
Taller 5: Añade navegabilidad entre pantallas y tu aplicación
Sesión 6: APIS DE REACT (CÁMARA, UBICACIÓN Y NOTIFICACIONES)
Acceso a la cámara con Camera API
Acceso a la ubicación con Location API
Manejo de notificaciones con Notification API
Gestión HTTP con API's API Fetch
Gestión HTTP con API's Axios
Caso 6: Conexión de cámara con una aplicación móvil
Taller 6: Conecta tu aplicación con fuentes externas de datos dinámicos
Proyectos Integradores
Programación web con HTML & CSS
En este proyecto, desarrollarás una interfaz para mejorar la interacción con tus usuarios. Definirás las funcionalidades, crearás un prototipo inicial, e implementarás componentes para optimizar la aplicación. Finalmente, establecerás controles efectivos y un framework para mejorar el flujo de trabajo.
Programación Javascript Web
En este proyecto integrador, crearás una aplicación web interactiva. Implementarás un contador de visitas, un sistema de recomendaciones, y una galería interactiva. Además, permitirás que el usuario modifique el contenido en tiempo real e integrarás una lista de tareas interactiva.
React Js & React Native
En este proyecto, desarrollarás una plataforma web y móvil para la gestión de datos. Crearás un sistema de tarjetas digitales con componentes reutilizables, una lista de productos en tiempo real y un sistema de navegación dinámico. Para móvil, crearás una app de notas con navegación entre pantallas y conexión a datos externos.
Testimonios
Llevamos capacitando a más de 100.000 alumnos en 25 países. El 85% de nuestros egresados logra conseguir su primer empleo o ascenso profesional.
¡Inscríbete en 3 pasos!
Sigue los pasos del tutorial e inscríbete en línea en menos de 1 minuto
Campus virtual
Clases grabadas, material académico y acceso a todos tus programas en un solo lugar
Garantía de aprendizaje
Si durante el programa presentas alguna disconformidad, te reasignaremos a un nuevo inicio de edición