Días de aplicación: Lunes Martes Miércoles Jueves Viernes Sábado
Modalidad: Presencial y En linea
Cupo: Abierto
Este curso proporciona una introducción a HTML5, CSS3 y JavaScript. Este curso ayuda a los estudiantes a adquirir habilidades básicas de programación HTML5 / CSS3 / JavaScript. Este curso es un punto de entrada tanto en la aplicación web como en las rutas de capacitación de las aplicaciones de la Tienda Windows. El curso se enfoca en usar HTML5 / CSS3 / JavaScript para implementar la lógica de programación, definir y usar variables, realizar bucles y ramificaciones, desarrollar interfaces de usuario, capturar y validar la entrada del usuario, almacenar datos y crear aplicaciones bien estructuradas. Los cursos se seleccionan para respaldar y demostrar la estructura de varios escenarios de aplicación. Su objetivo es centrarse en los principios y componentes / estructuras de codificación que se utilizan para establecer una aplicación de software HTML5. Este curso utiliza Visual Studio 2017, que se ejecuta en Windows 10.
Perfil de audiencia
Este curso está dirigido a desarrolladores profesionales que tienen de 6 a 12 meses de experiencia en programación y que están interesados en desarrollar aplicaciones usando HTML5 con JavaScript y CSS3 (aplicaciones de la Tienda Windows para Windows 10 o aplicaciones web).
Al término del curso
Módulo 1: Descripción general de HTML y CSS
La mayoría de las aplicaciones web modernas se basan en una base de
páginas HTML que describen el contenido con el que los usuarios leen e
interactúan, las hojas de estilo para que el contenido sea visualmente
agradable y el código JavaScript para proporcionar un nivel de interactividad
entre el usuario y la página, y la página y el servidor. El navegador web
utiliza el marcado HTML y las hojas de estilo para representar este contenido,
y ejecuta el código JavaScript para implementar el comportamiento de la aplicación.
Este módulo revisa los conceptos básicos de HTML y CSS, y presenta las
herramientas que este curso utiliza para crear páginas HTML y hojas de estilo.
Módulo 2: Crear y diseñar páginas HTML
Las tecnologías que forman la base de todas las aplicaciones web (HTML,
CSS y JavaScript) han estado disponibles durante muchos años, pero el propósito
y la sofisticación de las aplicaciones web han cambiado significativamente.
HTML5 es la primera revisión importante de HTML en 10 años, y proporciona un
medio muy adecuado para presentar contenido para aplicaciones web
tradicionales, aplicaciones que se ejecutan en dispositivos móviles de mano y
también en la plataforma Windows 10. Este módulo presenta HTML5, describe sus
nuevas características, muestra cómo presentar contenido mediante el uso de las
nuevas características en HTML5 y cómo diseñar este contenido mediante CSS.
Módulo 3: Introducción a JavaScript
HTML y CSS proporcionan información estructural, semántica y de
presentación para una página web. Sin embargo, estas tecnologías no describen
cómo el usuario interactúa con una página utilizando un navegador. Para
implementar esta funcionalidad, todos los navegadores modernos incluyen un
motor de JavaScript para admitir el uso de scripts en una página. También
implementan Document Object Model (DOM), un estándar W3C que define cómo un
navegador debe reflejar una página en la memoria para permitir que los motores
de scripts accedan y alteren el contenido de esa página. Este módulo presenta
programación de JavaScript y DOM.
Módulo 4: Crear formularios para recopilar y validar la entrada del
usuario
Las aplicaciones web con frecuencia necesitan recopilar las aportaciones
de los usuarios para realizar sus tareas. Una página web debe ser clara y
concisa sobre la información que se espera de un usuario para minimizar los
malentendidos frustrantes sobre la información que el usuario debe
proporcionar. Además, todas las entradas deben validarse para garantizar que se
ajustan a los requisitos de la aplicación. En este módulo, aprenderá a definir
formularios de entrada utilizando los nuevos tipos de entrada disponibles en
HTML5. También verá cómo validar los datos mediante el uso de atributos HTML5.
Finalmente, aprenderá cómo realizar una validación de entrada extendida
utilizando el código JavaScript y cómo proporcionar comentarios a los usuarios
cuando su entrada no es válida o no coincide con las expectativas de la
aplicación.
Módulo 5: Comunicación con un servidor remoto
Muchas aplicaciones web requieren el uso de datos almacenados en un
sitio remoto. En algunos casos, puede acceder a estos datos simplemente descargándolos
de una URL específica, pero en otros casos los datos se encapsulan en el sitio
remoto y se hacen accesibles a través de un servicio web. En este módulo,
aprenderá cómo acceder a un servicio web utilizando el código JavaScript e
incorporar datos remotos en sus aplicaciones web. Observará dos tecnologías
para lograr esto: el objeto XMLHttpRequest, que actúa como un contenedor
programático alrededor de las solicitudes HTTP a sitios web remotos, y Fetch
API, que simplifica muchas de las tareas involucradas en el envío de
solicitudes y la recepción de datos. Debido a que la API Fetch y el objeto
XMLHttpRequest son API asincrónicas Primero aprenderá cómo manejar tareas
asincrónicas con el objeto Promise, las funciones de flecha y la nueva sintaxis
asincrónica / en espera que le permite manejar solicitudes asincrónicas como si
estuvieran sincronizadas.
Módulo 6: Estilo HTML5 usando CSS3
Diseñar el contenido que muestra una página web es un aspecto importante
para hacer que una aplicación sea atractiva y fácil de usar. CSS es el
mecanismo principal que utilizan las aplicaciones web para implementar el
estilo, y las características agregadas a CSS3 admiten muchas de las nuevas
capacidades que se encuentran en los navegadores modernos. Cuando CSS1 y CSS2.1
eran documentos únicos, el World Wide Web Consortium ha optado por escribir
CSS3 como un conjunto de módulos, cada uno de los cuales se centra en un solo
aspecto de la presentación, como el color, el texto, el modelo de cuadro y las
animaciones. Esto permite que las especificaciones se desarrollen gradualmente,
junto con sus implementaciones. Cada especificación define propiedades y
valores que ya existen en CSS1 y CSS2, y también nuevas propiedades y valores.
En este módulo, examinará las propiedades y los valores definidos en varios de
estos módulos, los nuevos selectores definidos en CSS3 y el uso de
pseudo-clases y pseudo-elementos para refinar esas selecciones.
Módulo 7: Crear objetos y métodos usando JavaScript
La reutilización del código y la facilidad de mantenimiento son
objetivos clave para escribir aplicaciones bien estructuradas. Si puede cumplir
con estos objetivos, reducirá los costos asociados con la escritura y el
mantenimiento de su código. Este módulo describe cómo escribir código JavaScript
bien estructurado mediante el uso de características del lenguaje, como
espacios de nombres, objetos, encapsulación y herencia. Estos conceptos pueden
parecerle familiares si tiene experiencia en un lenguaje como Java o C #, pero
el enfoque de JavaScript es bastante diferente y hay muchas sutilezas que debe
comprender si desea escribir código que se pueda mantener.
Módulo 8: Crear páginas interactivas utilizando API HTML5
La interactividad es un aspecto clave de las aplicaciones web modernas,
lo que le permite crear sitios web atractivos que pueden responder rápidamente
a las acciones del usuario, y también adaptarse a la ubicación del usuario. Este
módulo describe cómo crear aplicaciones web HTML5 interactivas que pueden
acceder al sistema de archivos local, permitir al usuario arrastrar y soltar
datos en elementos de una página web, reproducir archivos multimedia y obtener
información de geolocalización.
Módulo 9: Agregar soporte sin conexión a aplicaciones web
Las aplicaciones web dependen de poder conectarse a una red para obtener
páginas web y datos. Sin embargo, en algunos entornos, una conexión de red
puede ser intermitente. En estas situaciones, puede ser útil permitir que la
aplicación continúe funcionando mediante el uso de datos almacenados en caché
en el dispositivo del usuario. HTML5 ofrece una opción de nuevas opciones de
almacenamiento del lado del cliente, incluido el almacenamiento de sesión y el
almacenamiento local, y un mecanismo de almacenamiento en caché de recursos
llamado Application Cache. En este módulo, aprenderá a usar estas tecnologías
para crear aplicaciones web robustas que puedan continuar ejecutándose incluso
cuando no haya una conexión de red disponible.
Módulo 10: Implementación de una interfaz de usuario adaptativa
Una de las características más duraderas de la web es su naturaleza
temporal. Por primera vez, el monopolio del teclado y el mouse está bajo
desafío, y eso significa cuestionar cómo se diseñan las interfaces de usuario. Puede
desarrollar una aplicación web en una computadora con un monitor grande de alta
resolución, un mouse y un teclado, pero otros usuarios pueden ver e interactuar
con su aplicación en un teléfono inteligente o tableta sin un mouse, o tener un
monitor con Una resolución diferente. Los usuarios también pueden querer
imprimir páginas de su aplicación. En este módulo, aprenderá a crear un sitio
web que adapte el diseño y la funcionalidad de sus páginas a las capacidades y
al factor de forma del dispositivo en el que se está visualizando. Verá cómo detectar
el tipo de dispositivo que se usa para ver una página y aprenderá estrategias
para diseñar contenido que se dirija efectivamente a dispositivos particulares.
Módulo 11: Creación de gráficos avanzados
Los gráficos interactivos de alta resolución son una parte clave de la
mayoría de las aplicaciones modernas. Los gráficos pueden ayudar a mejorar la
experiencia del usuario al proporcionar un aspecto visual al contenido,
haciendo que un sitio web sea más atractivo y fácil de usar. La interactividad
permite que los elementos gráficos de un sitio web se adapten y respondan a las
aportaciones del usuario o los cambios en el entorno, y es otro elemento
importante para retener la atención del usuario y su interés en el contenido.
Este módulo describe cómo crear gráficos avanzados en HTML5 mediante el uso de
Gráficos vectoriales escalables (SVG) y la API de Microsoft Canvas. Aprenderá a
usar elementos relacionados con SVG como, y para mostrar contenido gráfico en
una página web. También aprenderá a permitir que el usuario interactúe con
elementos SVG mediante el uso de eventos como eventos de teclado y eventos de
mouse. La API de Canvas es algo.
Módulo 13: Implementación de comunicación en tiempo real mediante el uso
de sockets web
Las páginas web solicitan datos a pedido de un servidor web mediante el
envío de solicitudes HTTP. Este modelo es ideal para crear aplicaciones
interactivas, donde la funcionalidad es impulsada por las acciones de un
usuario. Sin embargo, en una aplicación que necesita mostrar información en
constante cambio, este mecanismo es menos adecuado. Por ejemplo, una página de
acciones financieras no tiene valor si muestra precios que tienen incluso unos
pocos minutos de antigüedad, y no puede esperar que un usuario actualice
constantemente la página que se muestra en el navegador. Aquí es donde los
sockets web son útiles. La API de Web Sockets proporciona un mecanismo para
implementar la comunicación bidireccional en tiempo real entre el servidor web y
el navegador. Este módulo presenta los sockets web, describe cómo funcionan y
explica cómo crear una conexión de sockets web que se pueda utilizar para
transmitir datos en tiempo real entre una página web y un servidor web.
Módulo 14: Realización de procesamiento en segundo plano mediante el uso
de trabajadores web
El código JavaScript es una herramienta poderosa para implementar la
funcionalidad en una página web, pero debe recordar que este código se ejecuta
cuando se carga una página web o en respuesta a las acciones del usuario
mientras se muestra la página web. El navegador ejecuta el código, y si el
código realiza operaciones que requieren un tiempo considerable para
completarse, el navegador puede dejar de responder y degradar la experiencia
del usuario. HTML5 presenta a los trabajadores web, que le permiten descargar
el procesamiento para separar subprocesos en segundo plano y, por lo tanto,
permiten que el navegador siga respondiendo. Este módulo describe cómo operan
los trabajadores web y cómo puede usarlos en sus aplicaciones web.
Módulo 15: Empaquetado de JavaScript para el despliegue de producción
El uso de modelos le permite crear aplicaciones grandes y complejas. El
progreso del lenguaje en la versión de ECMAScript6 permite que la aplicación de
compilación simplifique el proceso de construcción de la aplicación. Sin
embargo, el uso de módulos ECMAScript6 y otras características aún no es
compatible con todos los navegadores. Herramientas como Node.js, Webpack y
Babel permiten el uso de nuevas funciones de lenguaje junto con soporte para
diferentes navegadores para evitar dañar la experiencia del usuario. En este
módulo presentaremos la teoría detrás de estas herramientas, cuando necesitemos
usarlas, y las diferentes opciones de uso. Al final del módulo, veremos cómo
usar estas herramientas para escribir código ECMAScript6 compatible con todos
los navegadores.
1 a 3 meses de experiencia creando aplicaciones web, incluida la
escritura de código JavaScript simple
1 mes de experiencia creando aplicaciones cliente de Windows
1 mes de experiencia con Visual Studio 2017