
HTML5 Web Application Development By Example
J.M. Gustafson
- Editorial
- Packt
- Año
- 2013
- Páginas
- ~276
- Nivel
- Intermedio
De qué trata
Guía de la serie Beginner's Guide de Packt en la que J.M. Gustafson enseña a construir aplicaciones web interactivas desde cero con HTML5, CSS3 y jQuery, tal como estaban en 2013. La editorial dice que no hace falta experiencia previa con HTML5. Aun así, se aprovecha mucho más si ya conoces lo básico de HTML, CSS y JavaScript y quieres pasar de páginas estáticas a aplicaciones que corren en el navegador de cualquier dispositivo.
Cada capítulo presenta una API de HTML5 aplicándola a una aplicación concreta. Empieza con la estructura de una aplicación y el uso de localStorage para guardar su estado. Sigue con estilos y efectos visuales con CSS3, diseño adaptable, atributos data-* personalizados para enlazar datos y los nuevos tipos de campos de formulario. Después llega a la API de Canvas para dibujar, con eventos táctiles, carga de imágenes mediante la File API y tratamiento de imágenes píxel a píxel. La segunda mitad recorre la API de Audio, las peticiones Ajax a servicios web, los Web Workers para tareas pesadas en segundo plano y, al final, cómo empaquetar y publicar una aplicación. Cada capítulo cierra con preguntas de repaso (pop quiz) y retos opcionales.
Lo mejor del libro es su progresión práctica: varias miniaplicaciones que se amplían de un capítulo a otro y muestran cómo se combinan las API del navegador sin usar frameworks. Hay que tener en cuenta su época: usa jQuery de forma intensiva y algunas técnicas de publicación (como el application cache) ya están obsoletas y hoy las reemplazan los service workers y las PWA. No trata frameworks modernos ni backend. Sirve como introducción histórica y conceptual a las API nativas del navegador, pero conviene contrastar los detalles con la documentación actual.
- HTML5
- CSS3
- jQuery
- localStorage
- Atributos data-*
- Canvas API
- File API
- Web Audio
- Ajax
- Web Workers
- Diseño adaptable
¿Cómo enseña?
Con proyectos
- ✓ Incluye ejercicios
- ✓ Incluye proyectos
Proyectos
Lista de tareas (Task at Hand)
Aplicación de tareas que se crea en los primeros capítulos: guarda su estado en localStorage, se estiliza con CSS3 y se amplía con detalles de cada tarea gracias a atributos data-* y a los nuevos tipos de campos de HTML5.
Canvas Pad y Photo Pad
Aplicación de dibujo con la API de Canvas y una barra de herramientas reutilizable, con soporte táctil. Después se extiende a un editor de fotos que carga imágenes con la File API y las modifica píxel a píxel.
Piano virtual y juego Piano Hero
Piano que se toca en el navegador usando la API de Audio, convertido luego en un juego de ritmo.
Widget del tiempo
Componente que consulta un servicio web de información meteorológica mediante Ajax con jQuery y muestra los datos en la página.

