Curso - Programming in HTML5 with JavaScript and CSS3
Sobre este curso
Este curso proporciona una introducción a HTML5, CSS3 y JavaScript. Este curso ayuda a los estudiantes a adquirir habilidades de programación HTML5/CSS3/JavaScript básicas. Este curso es un punto de entrada a la aplicación Web y aplicaciones de Windows Store caminos de formación. El curso se centra en el uso de HTML5/CSS3/JavaScript para implementar lógica de programación, definir y utilizar variables, realizar bucles y ramificación, desarrollar interfaces de usuario, capturar y validar entradas del usuario, almacenar los datos y crear aplicación bien estructurado.
Los escenarios de laboratorio en este curso se seleccionan para apoyar y demostrar la estructura de diversos escenarios de aplicación.Que deben concentrarse en los principios y estructuras componentes de codificación que se utilizan para establecer una aplicación de software de HTML5.
Este curso utiliza Visual Studio 2012, corriendo en Windows 8.
Perfil de audiencia
Este curso está diseñado para desarrolladores profesionales que tienen 6-12 meses de experiencia de programación y que están interesados en el desarrollo de aplicaciones usando HTML5 con JavaScript y CSS3 (o aplicaciones de Windows Store para aplicaciones web o Windows 8).
Este curso está dirigido a los estudiantes que tienen la siguiente experiencia:
- 1 – 3 meses de experiencia crea aplicaciones Web, incluso escribir código JavaScript sencillo
- 1 mes de experiencia crea aplicaciones de cliente de Windows
- 1 mes de experiencia en el uso de Visual Studio 2010 o 2012
Este curso no está dirigido a desarrolladores con tres o más meses de HTML5 experiencia de codificación.
Los estudiantes deciden asistir a este curso sin un fondo de desarrollo presten especial atención a los requisitos de formación. Los desarrolladores que tienen más de 5 años de experiencia de programación pueden encontrar que porciones de esta formación son fundamentales en la naturaleza en la presentación de la sintaxis asociada a ciertas tareas de programación.
Individuos que están interesados en tomar el examen 70-480 : programación en HTML5 con JavaScript y CSS3, también puede asistir a este curso.
En el curso
Después de completar este curso, los estudiantes serán capaces de:
- Explica cómo utilizar Visual Studio 2012 para crear y ejecutar una aplicación Web.
- Describir las nuevas características de HTML5, y crear estilo HTML5 páginas.
- Agregar interactividad a una página de HTML5 con JavaScript.
- Crear formularios HTML5 usando diferentes tipos de entrada y validar entradas del usuario mediante atributos HTML5 y código JavaScript.
- Enviar y recibir datos de un origen de datos remoto utilizando XMLHTTPRequest objetos y operaciones de AJAX de jQuery.
- Páginas de HTML5 estilo utilizando CSS3.
- Crear el código JavaScript bien estructurado y fácilmente mantenible.
- Utilizar APIs de HTML5 comunes en aplicaciones Web interactivas.
- Crear aplicaciones Web que soportan las operaciones fuera de línea.
- Crear páginas Web HTML5 que pueden adaptarse a diferentes dispositivos y factores de forma.
- Añadir gráficos avanzados para una página HTML5 utilizando elementos de tela y usando y gráficos vectoriales escalables.
- Mejorar la experiencia de usuario añadiendo animaciones en una página HTML5.
- Usar Web Sockets para enviar y recibir datos entre una aplicación Web y un servidor.
- Mejorar la capacidad de respuesta de una aplicación Web que realiza operaciones de larga duración mediante el uso de procesos de trabajo de la Web.
Requisitos previos
Antes de asistir a este curso, los estudiantes deben tener al menos tres meses de experiencia en el desarrollo profesional.
Además de su experiencia profesional, los estudiantes que asisten a esta capacitación deben tener una combinación de conocimientos prácticos y conceptuales relacionados con la programación HTML5. Esto incluye los requisitos previos siguientes:
- Comprender la estructura básica del documento HTML:
- Cómo utilizar HTML etiquetas para mostrar contenido de texto.
- Cómo utilizar HTML etiquetas para mostrar gráficos.
- Cómo utilizar APIs de HTML.
- Comprender cómo el estilo común elementos HTML utilizando CSS, incluyendo:
- Cómo separar presentación de contenido
- Cómo gestionar el flujo de contenido.
- Cómo controlar la posición de los elementos individuales.
- Cómo aplicar un estilo CSS básico.
- Comprender cómo escribir código JavaScript para agregar funcionalidad a una página web:
- Cómo crear y utilizar variables
- Cómo utilizar:
- operadores aritméticos para realizar cálculos aritméticos que involucran una o más variables
- operadores relacionales para probar la relación entre dos variables o expresiones
- operadores lógicos para combinar expresiones que contienen operadores relacionales
- Cómo controlar el flujo de programa utilizando if... else declaraciones.
- Cómo implementar iteraciones mediante el uso de bucles.
- Cómo escribir funciones simples.
Curso
Módulo 1: Resumen de HTML y CSS Este módulo proporciona una visión general de HTML y CSS y describe cómo utilizar Visual Studio 2012 para construir una aplicación Web.
Lecciones
- Resumen de HTML
- Resumen de CSS
- Creación de una aplicación Web mediante Visual Studio 2012
Laboratorio: Explorar la aplicación de conferencia de Contoso
- Tutorial de la aplicación de conferencia de Contoso
- Examinar y modificar la aplicación Conferencia de Contoso
Después de completar este módulo, los estudiantes serán capaces de:
- Describir atributos y elementos básicos de HTML.
- Explicar la estructura del CSS.
- Describir las herramientas disponibles en Visual Studio 2012 para crear aplicaciones Web.
Módulo 2: Creación y diseño páginas HTML5 Este módulo describe las nuevas características de HTML5 y explica cómo crear y estilo HTML5 páginas.
Lecciones
- Creación de una página HTML5
- Estilo de una página HTML5
Lab: Creación y diseño páginas HTML5
- Crear paginas HTML5
- Páginas de HTML5 estilo
Después de completar este módulo, los estudiantes serán capaces de:
- Crear páginas estáticas usando las nuevas características disponibles en HTML5.
- Uso CSS3 para aplicar un estilo básico a los elementos de una página HTML5.
Módulo 3: Introducción a JavaScript Este módulo ofrece una introducción al lenguaje JavaScript y muestra cómo utilizar JavaScript para añadir interactividad a las páginas de HTML5.
Lecciones
- Resumen de sintaxis JavaScript
- Programación DOM de HTML con JavaScript
- Introducción a jQuery
Laboratorio: Visualización de datos y control de eventos mediante el uso de JavaScript
- Mostrar datos mediante programación
- Control de eventos
Después de completar este módulo, los estudiantes serán capaces de:
- Explicar la sintaxis de JavaScript y describir cómo utilizar JavaScript con HTML5.
- Escriba el código JavaScript que manipula los eventos DOM de HTML y los mangos.
- Describe cómo utilizar jQuery para simplificar el código que utiliza muchas APIs de JavaScript comunes.
Módulo 4: Creación de formularios para recopilar datos y validar entradas del usuario Este módulo describe los nuevos tipos de entrada disponibles con HTML5 y explica cómo crear formularios para recolectar y validar entradas del usuario mediante el uso de los nuevos atributos de HTML5 y el código JavaScript.
Lecciones
- Resumen de las formas y tipos de entrada
- Validación de entrada de usuario con atributos de HTML5
- Validación de entrada de usuario con JavaScript
Laboratorio: Crear un formulario y validación de entrada de usuario
- Crear un formulario y validación de entrada de usuario con atributos de HTML5
- Validación de entrada de usuario con JavaScript
Después de completar este módulo, los estudiantes serán capaces de:
- Crear formularios que utilizan los nuevos tipos de entrada de HTML5.
- Validar usuario y ofrecer retroalimentación mediante el uso de los nuevos atributos de HTML5.
- Escribir código JavaScript para validar entradas del usuario y proporcionar la regeneración en casos donde no es conveniente utilizar HTML5 atributos
Módulo 5: Comunicación con un origen de datos remoto Este módulo describe cómo enviar y recibir datos de un origen de datos remoto utilizando un objeto XMLHTTPRequest y realizando operaciones de AJAX de jQuery.
Lecciones
- Enviar y recibir datos mediante el uso de XMLHTTPRequest
- Enviar y recibir datos mediante el uso de las operaciones de AJAX de jQuery
Laboratorio: Comunicarse con un origen de datos remoto
- Recuperación de datos
- Serialización y transmisión de datos
- Refactorización del código mediante método ajax de jQuery
Después de completar este módulo, los estudiantes serán capaces de:
- Serializar, deserializar, enviar y recibir datos mediante los objetos XMLHTTPRequest.
- Simplificar el código que serializa, se deserializa, envía y recibe datos utilizando el método ajax de jQuery
Módulo 6: Estilo HTML5 usando CSS3 Este módulo describe cómo el estilo HTML5 páginas y elementos mediante el uso de las nuevas características disponibles en CSS3.
Lecciones
- Estilo texto
- Elementos de estilo bloque
- Selectores de CSS3
- Aumento de efectos gráficos usando CSS3
Laboratorio: Texto de estilo y elementos de bloque utilizando CSS3
- Estilo de la barra de navegación
- Estilo del encabezado de página
- Estilizar la página
Después de completar este módulo, los estudiantes serán capaces de:
- Estilo de elementos de texto de una página HTML5 usando CSS3.
- Aplicar estilo a elementos de bloque utilizando CSS3.
- Utilizar selectores de CSS3 para especificar los elementos para ser labrado en una aplicación Web.
- Aplicar efectos gráficos y transformaciones mediante el uso de las nuevas propiedades de CSS3.
Módulo 7: Creación de objetos y métodos mediante JavaScript Este módulo explica cómo escribir código JavaScript bien estructurado y fácilmente mantenible y cómo aplicar principios orientados a objetos a código JavaScript en una aplicación Web.
Lecciones
- Escribir JavaScript bien estructurado
- Creación de objetos personalizados
- Extendiendo objetos
Laboratorio: Refinación código de mantenibilidad y extensibilidad
- Herencia de objetos
- Refactorización de código para utilizar los objetos
Después de completar este módulo, los estudiantes serán capaces de:
- Describir los beneficios de estructurar código JavaScript cuidadosamente para ayudar a mantenimiento y extensibilidad.
- Explicar las mejores prácticas para la creación de objetos personalizados en JavaScript.
- Describe cómo extender los objetos nativos y personalizados para agregar funcionalidad.
Módulo 8: Creación de páginas interactivas usando las APIs de HTML5 Este módulo describe cómo utilizar algunas APIs comunes de HTML5 para añadir elementos interactivos a una aplicación Web.Este módulo también explica cómo depurar y Perfil de una aplicación Web.
Lecciones
- Interactuar con archivos
- Incorporación de Multimedia
- Reaccionar al contexto y ubicación de navegador
- Depuración y perfiles de una aplicación Web
Lab: Creación de páginas interactivas mediante el uso de las APIs de HTML5
- Incorporación de Video
- Incorporación de imágenes
- Usando la API de geolocalización
Después de completar este módulo, los estudiantes serán capaces de:
- Utilizar la rastra y gota y las API de archivo para interactuar con archivos en una aplicación Web.
- Incorporar audio y vídeo en una aplicación Web.
- Detectar la ubicación del usuario ejecuta una aplicación Web utilizando la API de geolocalización.
- Explicar cómo depurar y Perfil de una aplicación Web utilizando la API de sincronización Web y las herramientas de desarrollador de Internet Explorer.
Módulo 9: Añadiendo soporte Offline para aplicaciones Web Este módulo describe cómo añadir soporte offline a una aplicación Web, para permitir la aplicación para seguir funcionando en el navegador de un usuario incluso si el navegador se desconecta de la red.
Lecciones
- Leer y escribir datos localmente
- Adición de soporte fuera de línea mediante el uso de caché de la aplicación
Laboratorio: Adición de soporte fuera de línea para una aplicación Web
- Implementación de caché de la aplicación
- Aplicación de almacenamiento Local
Después de completar este módulo, los estudiantes serán capaces de:
- Guardar y recuperar datos localmente en el equipo del usuario utilizando la API de almacenamiento Local.
- Proporcionan soporte offline para una aplicación Web utilizando la API de caché de la aplicación.
Módulo 10: Implementación de una interfaz de usuario adaptable Este módulo describe cómo crear páginas de HTML5 que dinámicamente pueden detectar y adaptarse a diferentes dispositivos y factores de forma.
Lecciones
- Apoyo a múltiples factores de forma
- Crear una interfaz de usuario adaptable
Laboratorio: Implementar una interfaz de usuario adaptable
- Crear una hoja de estilos para imprimir
- Adaptación de diseño de página para adaptarse a un Factor de forma diferente
Después de completar este módulo, los estudiantes serán capaces de:
- Describir la necesidad de detectar las capacidades del dispositivo y reaccionar ante factores de forma diferentes en una aplicación Web.
- Crear una página Web que se adaptan dinámicamente su diseño para que coincida con diferentes formatos.
Módulo 11: Creación de gráficos avanzados Este módulo describe cómo crear gráficos avanzados para una aplicación HTML5 Web mediante el uso de un elemento Canvas y mediante el uso de gráficos vectoriales escalables.
Lecciones
- Creación de gráficos interactivos mediante el uso de gráficos vectoriales escalables
- Gráficos de dibujo mediante programación mediante el uso de un lienzo
Lab: Creación de gráficos avanzados
- Crear un mapa interactivo del lugar mediante el uso de gráficos vectoriales escalables
- Crear una insignia del altavoz mediante el uso de un elemento Canvas
Después de completar este módulo, los estudiantes serán capaces de:
- Utilice gráficos vectoriales escalables para añadir gráficos interactivos a una aplicación.
- Dibujar gráficos complejos en un elemento Canvas de HTML5 utilizando código JavaScript.
Módulo 12: Animación de la interfaz de usuario Este módulo describe cómo mejorar la experiencia del usuario en una aplicación HTML5 Web agregando animaciones.
Lecciones
- Aplicar transiciones de CSS
- Transformación de elementos
- Aplicar animaciones de fotogramas clave CSS
Laboratorio: Animación de elementos de la interfaz de usuario
- Aplicar transiciones a elementos de la interfaz de usuario
- Aplicar animaciones de fotogramas clave
Después de completar este módulo, los estudiantes serán capaces de:
- Aplicar transiciones de CSS a elementos de una página HTML5 y escriba código JavaScript para detectar cuando se ha producido una transición.
- Describir los diferentes tipos de transiciones 2D y 3D con CSS3
- Implementar animaciones complejas mediante fotogramas clave CSS y código JavaScript.
Módulo 13: Implementación de comunicaciones en tiempo real mediante el uso de Web Sockets Este módulo explica cómo usar Web Sockets para transmitir y recibir datos entre un servidor y una aplicación Web de HTML5.
Lecciones
- Introducción a Web tomas
- Enviar y recibir datos mediante el uso de Web Sockets
Laboratorio: Implementación de comunicaciones en tiempo real mediante el uso de Web Sockets
- Recepción de datos desde Web Socket
- Envío de datos a una toma de la Web
- Enviar múltiples tipos de mensajes a o desde una toma de la Web
Después de completar este módulo, los estudiantes serán capaces de:
- Explicar cómo funcionan los Web Sockets y se describe cómo enviar y recibir datos a través de una toma de la Web.
- Utilizar la API de Socket de Web con JavaScript para conectarse a un servidor de Web sockets, enviar y recibir datos y manejar los diferentes eventos que pueden ocurrir cuando un mensaje es enviado o recibido.
Módulo 14: Creando un proceso de trabajo Web Este módulo describe cómo utilizar Web procesos de trabajo para realizar operaciones de larga duración de forma asincrónica y mejorar la capacidad de respuesta de una aplicación Web de HTML5.
Lecciones
- Introducción a los trabajadores de la Web
- Realizar procesamiento asíncrono mediante un trabajador Web
Lab: Creación de un proceso de trabajo Web
- Mejorar la capacidad de respuesta mediante el uso de un trabajador de la Web
Después de completar este módulo, los estudiantes serán capaces de:
- Describir el propósito de un proceso de trabajo de la Web, y cómo puede utilizarse para realizar el procesamiento asíncrono, así como proporcionar aislamiento para operaciones sensibles.
- Utilizar las API de trabajador Web desde código JavaScript para crear, ejecutar y controlar un proceso de trabajo de la Web.
