Diploma Javascript Frontend Developer

Online 1 año

---

El diploma «Javascript Frontend Developer» ha sido diseñado para brindar a los estudiantes una formación completa y progresiva en el desarrollo frontend.

Comenzando con el «Curso Básico de HTML5», los estudiantes adquieren conocimientos fundamentales sobre la construcción estructural de páginas web, estableciendo una base sólida.

A continuación, el «Curso Básico de CSS3» amplía estas habilidades, permitiendo a los estudiantes estilizar y diseñar páginas web de manera efectiva para crear interfaces visualmente atractivas.

El curso «Curso Básico de JavaScript» introduce a los estudiantes en la programación web, capacitándolos para manipular el contenido de las páginas y ofrecer experiencias interactivas.

Avanzando en la progresión, el «Curso Básico de ReactJS» profundiza en la construcción de interfaces interactivas utilizando una de las bibliotecas más populares de JavaScript, proporcionando las habilidades necesarias para desarrollar aplicaciones web dinámicas y eficientes.

Finalmente, el «Curso Básico de Git: Control de Versiones y Colaboración» cierra el bloque, equipando a los estudiantes con las destrezas esenciales para el control de versiones y la colaboración eficiente en proyectos de desarrollo, habilidades críticas en entornos profesionales de desarrollo de software.

Perfil de Egreso

En conjunto, los estudiantes que completen exitosamente este programa estarán preparados para destacarse como desarrolladores frontend competentes, capaces de diseñar y construir interfaces web interactivas y estilizadas, así como colaborar efectivamente en proyectos de desarrollo.

Temario

HTML5: Construcción de Páginas Web

1. Introducción a HTML5
¿Qué es HTML5 y por qué es esencial en el desarrollo web?
Conceptos clave: elementos, etiquetas y atributos.
Estructura básica de una página HTML5.

2. Etiquetas de Texto y Enlaces
Uso de etiquetas para encabezados, párrafos y formatos de texto.
Inclusión de enlaces (hipervínculos) a otras páginas y recursos.
Uso de etiquetas semánticas para encabezados y párrafos.

3. Inserción de Imágenes y Multimedia
Incorporación de imágenes en páginas web.
Uso de etiquetas para audio y video.
Uso de etiquetas semánticas para imágenes y vídeos.

4. Organización de Contenido
Creación de listas (ordenadas y no ordenadas) para presentar información.
Uso de etiquetas de definición para glosarios.
Uso de etiquetas semánticas para listas y glosarios.

5. Presentación de Datos con Tablas
Creación de tablas para organizar y presentar datos.
Uso de celdas encabezado y combinación de celdas.
Uso de etiquetas semánticas para tablas.

6. Formularios y Recopilación de Datos
Utilización de etiquetas de formulario para crear campos de entrada.
Tipos de entrada: texto, contraseña, radio, casilla de verificación, etc.
Uso de etiquetas semánticas para formularios.

7. Etiquetas Semánticas y Prácticas Recomendadas
Introducción a etiquetas semánticas como header, nav, section, footer, etc.
Importancia de la accesibilidad y el SEO en el desarrollo web.
Prácticas recomendadas en la escritura de código HTML5.

8. Práctica y Proyecto Final
Implementación de una página web simple utilizando HTML5.
Aplicación de los conceptos aprendidos en un proyecto práctico.

CSS3: Estilización y Diseño de Páginas Web

1. Introducción a CSS3
¿Qué es CSS3 y por qué es esencial en el diseño web?
Conceptos clave: selectores, propiedades y valores.
Vinculación de archivos CSS a páginas HTML.

2. Modificación de Colores y Texto
Cambio de colores de fondo y de texto.
Estilización de fuentes y tamaños de texto.
Alineación y espaciado de texto.

3. Diseño de Cajas y Dimensiones
Modificación de márgenes y rellenos en elementos.
Control de bordes y esquinas redondeadas.
Establecimiento de dimensiones y tamaños de elementos.

4. Diseño Responsivo con Media Queries y Flexbox
Introducción a las media queries para crear diseños responsivos.
Adaptar contenido a diferentes tamaños de pantalla.
Diseño de páginas web que funcionan en dispositivos móviles y de escritorio.
Uso de flexbox para crear diseños flexibles y alineación de elementos.
Distribución de elementos en filas y columnas.
Creación de diseños complejos utilizando flexbox.

5. Práctica y Proyecto Final
Implementación de estilos CSS3 en una página web creada previamente.
Aplicación de los conceptos aprendidos en un proyecto práctico de diseño web.

Fundamentos de JavaScript: Introducción a la Programación Web

1. Introducción a JavaScript
– ¿Qué es JavaScript y por qué es fundamental en la programación web?
– Conceptos clave: variables, tipos de datos y estructuras de control.
– Incorporación de código JavaScript en páginas HTML.

2. Sintaxis y Fundamentos
– Aprender la sintaxis básica de JavaScript.
– Declaración de variables y asignación de valores.
– Uso de operadores para realizar cálculos y comparaciones.
– Introducción a la programación orientada a objetos.

3. Manipulación del DOM
– Acceso y modificación de elementos HTML utilizando JavaScript.
– Cambio de contenido, estilo y atributos de elementos.
– Manipulación de listas y tablas en la página.

4. Estructuras de Control y Funciones
– Creación de estructuras condicionales (if, else) para tomar decisiones.
– Uso de bucles (for, while) para repetir tareas.
– Creación y llamada de funciones en JavaScript.
– Gestión de estado en JavaScript

5. Eventos e Interactividad
– Asociación de eventos a elementos HTML.
– Manipulación de eventos de ratón y teclado.
– Creación de interactividad en la página utilizando JavaScript.

6. Uso Avanzado de Funciones
– Funciones flechas y su contexto.
– Funciones de orden superior y callbacks.
– Manipulación avanzada de arrays y objetos.

7. Asincronía y Promesas
– Entender la asincronía en JavaScript.
– Trabajar con promesas para manejar operaciones asíncronas.
– Resolución de problemas relacionados con la asincronía.

8. Práctica y Proyecto Final
– Implementación de interacciones interactivas en una página web.
– Aplicación de los conceptos aprendidos en un proyecto práctico de programación web.

Fundamentos de ReactJS: Construcción de Interfaces Interactivas

1. Introducción a ReactJS
– ¿Qué es React y por qué es relevante en el desarrollo frontend?
– Ventajas del enfoque basado en componentes.
– Comparación con otros frameworks y bibliotecas.

2. Configuración y Entorno de Desarrollo
– Instalación de Node.js y configuración de NPM.
– Creación de una aplicación React utilizando Create React App.
– Estructura básica de una aplicación React.

3. Construcción de Componentes
– Creación y renderización de componentes funcionales.
– Utilización de propiedades (props) para la comunicación entre componentes.
– Composición de componentes para construir interfaces complejas.

4. Estado y Ciclo de Vida
– Introducción al estado de componente y su importancia.
– Manejo de eventos y actualización del estado.
– Uso de métodos del ciclo de vida para controlar el comportamiento.

5. Enrutamiento en Aplicaciones React
– Introducción al enrutamiento con React Router.
– Creación de rutas y navegación entre componentes.
– Enrutamiento anidado para manejar estructuras complejas.

6. Integración de Bibliotecas Externas
– Uso de NPM para incorporar bibliotecas y paquetes.
– Incorporación de componentes de terceros en proyectos React.

7. Prácticas Recomendadas en el Desarrollo Frontend con React
– Organización del Proyecto: Estructura eficiente del proyecto.
– Optimización del Rendimiento: Técnicas para mejorar el rendimiento.

8. Depuración y Optimización en Aplicaciones React
– Herramientas de Depuración: Utilización de herramientas de depuración en React.
– Pruebas Unitarias y de Integración: Creación de pruebas con Jest y React Testing Library.

Fundamentos de Git: Control de Versiones y Colaboración

1. Introducción a Git y Control de Versiones
– ¿Qué es Git y por qué es esencial en el desarrollo de software?
– Conceptos clave: repositorio, commit, rama, fusión, entre otros.
– Ventajas del control de versiones en proyectos individuales y de equipo.

2. Configuración y Operaciones Básicas
– Instalación y configuración inicial de Git.
– Creación de un repositorio local.
– Realización de commits y seguimiento de cambios.

3. Trabajo con Ramas y Fusiones
– Creación y cambio entre ramas.
– Fusionando cambios entre ramas.
– Solución de conflictos de fusión.

4. Colaboración y Repositorios Remotos
– Clonación de repositorios remotos.
– Colaboración con otros desarrolladores.
– Realización de push y pull de cambios.
– Fetch repositorios.

5. Ramas y Flujo de Trabajo
– Flujo de trabajo con ramas: creación, combinación y eliminación.
– Etiquetado de versiones (tags) para marcar hitos importantes.

6. Práctica y Proyecto Final
– Implementación de un flujo de trabajo Git completo en un proyecto práctico.
– Colaboración en un repositorio remoto y manejo de ramas.