
HTML5 and JavaScript Projects, 2nd Edition
Jeanine Meyer
- Editorial
- Apress
- Año
- 2018
- Páginas
- ~425
- Nivel
- Intermedio
De qué trata
Segunda edición, totalmente actualizada (Apress, 2018), del libro de proyectos de Jeanine Meyer, profesora del Purchase College de la Universidad Estatal de Nueva York y antigua coordinadora del área de Matemáticas e Informática. Igual que la primera, acompaña a The Essential Guide to HTML5 y se dirige a lectores con conocimientos básicos de programación, HTML5 y JavaScript que quieren construir aplicaciones web más completas. Los proyectos siguen usando JavaScript "vanilla", sin frameworks.
Cada proyecto arranca con una descripción de cómo funciona la aplicación, a menudo con ilustraciones a color. Después repasa los conceptos de HTML5 y JavaScript que intervienen y termina con la explicación paso a paso de la programación. Los temas son el dibujo en canvas con escalado y etiquetas semánticas, la manipulación de objetos definidos por el programador, la animación y el enmascarado de video, la API de Google Maps combinada con canvas y con contenido multimedia, el almacenamiento local con localStorage, los dibujos lineales basados en matemáticas, los eventos de ratón y táctiles, y, como novedad de esta edición, el diseño responsivo y la accesibilidad.
Frente a la edición de 2011, se eliminan los capítulos que dependían de PHP y MySQL (el de geolocalización con envío de correo y el de base de datos). En su lugar entran el juego Add to 15 y un capítulo de diseño responsivo y accesibilidad, de modo que todo funciona en el navegador. Destaca por la claridad didáctica y la variedad de los proyectos. Conviene saber que no usa ES6+ de forma sistemática ni herramientas modernas como módulos, bundlers o frameworks, y que la API de Google Maps exige hoy una clave de API.
- HTML5 Canvas
- JavaScript
- Video HTML5
- Google Maps API
- localStorage
- Eventos de ratón y táctiles
- Juegos en el navegador
- Diseño responsivo
- Accesibilidad
- HTML semántico
¿Cómo enseña?
Con proyectos
- ✗ Sin ejercicios
- ✓ Incluye proyectos
Proyectos
Logo de HTML5
Dibujo del logo de HTML5 en canvas, con escalado y etiquetas semánticas.
Collage familiar
Manipulación sobre un canvas de fotos y figuras definidas como objetos JavaScript.
Video que rebota
Animación y enmascarado de un video HTML5 que se mueve por la pantalla.
Map Maker y Map Portal
Aplicaciones que combinan la API de Google Maps con canvas y usan el mapa para acceder a videos, audios e imágenes.
Juego Add to 15
Juego de cálculo que se ejecuta íntegramente en el navegador y reemplaza al capítulo de geolocalización con PHP de la primera edición.
Instrucciones de origami y rompecabezas de video
Instrucciones de plegado con dibujos generados matemáticamente, fotos y videos, y un rompecabezas que se ordena con el ratón o con gestos táctiles.
Juego de estados de EE. UU.
Juego con varias actividades para aprender los estados del país.

