HTML5 Data and Services Cookbook

Take the fast track to the rapidly growing world of HTML5 data and services with this brilliantly practical cookbook. Whether building websites or web applications, this is the handbook you need to master HTML5.

HTML5 Data and Services Cookbook

Cookbook

Gorgi Kosev, Mite MitreskiSeptember 2013

Take the fast track to the rapidly growing world of HTML5 data and services with this brilliantly practical cookbook. Whether building websites or web applications, this is the handbook you need to master HTML5.

Explore the full power of HTML5 - from number rounding to advanced graphics to real-time data binding - we have it covered.

Who This Book Is For

This book is for programmers and developers who work with a lot of backend code and want to get fast tracked into the world of HTML5 and Javascript. It is also for JavaScript developers who would like to update their knowledge with new techniques and capabilities made possible with HTML5.Some experience in HTML and jQuery is assumed.

Table of Contents

Chapter 1: Display of Textual Data

Introduction

Rounding numbers for display

Padding numbers

Displaying metric and imperial measurements

Displaying formatted dates in the user's time zone

Displaying the dynamic time that has elapsed

Displaying Math

Creating an endless scrolling list

Creating a sortable paginated table

Creating multiple-choice filters

Creating range filters

Creating combined complex filters

Displaying code in HTML

Rendering Markdown

Autoupdating fields

Chapter 2: Display of Graphical Data

Introduction

Creating a line chart

Creating a bar chart

Creating a pie chart

Creating an area chart

Displaying combined charts

Creating a bubble chart

Showing a map with a marked location

Showing a map with a path

Displaying gauges

Displaying a tree

LED scoreboard using web fonts

Chapter 3: Animated Data Display

Introduction

Making a motion chart

Displaying a force directed graph

Making a live range chart filter

Making an image carousel

Zooming and panning a chart

Using the web notifications API

Creating interactive Geo charts from a dataset

Chapter 4: Using HTML5 Input Components

Introduction

Using the text input field

Using textarea

Inputting dates

Inputting time

Telephone input

Range input field

Color picker input

Using single-choice dropdowns

Using multiple-choice select lists

Getting geographical location input

Using file inputs at the client side

Using a drag-and-drop file area

Chapter 5: Custom Input Components

Introduction

Using contentEditable for basic rich text input

Advanced rich text input

Creating a drop-down menu

Creating custom dialogs

Creating autocomplete for input

Creating a custom single-selection list

Creating a multiple-selection list

Geographic location input using maps

Chapter 6: Data Validation

Introduction

Validating text by length

Validating numbers by range

Using the built-in pattern validation

Advanced use of built-in constraints and custom validations

Calculating password strength

Validating US zip codes

Using asynchronous server-side validation

Combining client-side and server-side validation

Chapter 7: Data Serialization

Introduction

Deserializing JSON to JavaScript objects

Serializing objects to a JSON string

Decoding base64 encoded binary data

Encoding binary data or text into base64

Serializing binary data into JSON

Serializing and deserializing cookies

Serializing a form into request strings

Reading XML documents with DOMParser

Serialization of XML document at the client side

Chapter 8: Communicating with Servers

Creating an HTTP GET request to fetch JSON

Creating a request with custom headers

Versioning your API

Fetching JSON data with JSONP

Reading XML data from server

Using the FormData interface

Posting a binary file to the server

Creating an SSL connection with Node.js

Making real-time updates with Ajax Push

Exchanging real-time messages using WebSockets

Chapter 9: Client-side Templates

Introduction

Rendering objects using Handlebars

Rendering objects using EJS

Rendering objects using Jade

Rendering arrays using Handlebars

Rendering arrays using EJS

Rendering arrays using Jade

Simplifying templates with helpers in Handlebars

Reusing templates with partials in Handlebars

Reusing templates with partials in EJS

Using filters in Jade

Using mixins in Jade

Using layouts and blocks in Jade

Chapter 10: Data Binding Frameworks

Introduction

Creating a basic Angular view with data binding

Rendering lists and using Angular controllers

Routing, filters, and backend services in Angular

Using Angular's client-side validation

Making a chart component with Angular directives

Structuring applications for Meteor.js

Reactive programming and data in Meteor.js

Live HTML and user-specific data in Meteor.js

Security mechanisms in Meteor.js

Chapter 11: Data Storage

Introduction

Data URI

Session and local storage

Reading data from files

Using IndexedDB

Limits of the storage and how to ask for more

Manipulating the browser history

Chapter 12: Multimedia

Introduction

Playing audio files

Playing video files

Customizing controls for media elements

Adding text to your video

Embedding multimedia

Converting text to speech using HTML5 audio

What You Will Learn

Making charts using flot or HTML5 canvas.

Creating awesome visualizations with D3.js

Common helpers when working with input

Making animated and iteractive visualzations

Using the HTML5 input helpers

Creating custom input components

Client-side templating to simplify HTML generation

Manipulating and storing data on the client side

In Detail

HTML5 is everywhere. From PCs to tablets to smartphones and even TVs, the web is the most ubiquitous application platform and information medium bar. Its becoming a first class citizen in established operating systems such as Microsoft Windows 8 as well as the primary platform of new operating systems such as Google Chrome OS.

"HTML5 Data and Services Cookbook" contains over 100 recipes explaining how to utilize modern features and techniques when building websites or web applications. This book will help you to explore the full power of HTML5 - from number rounding to advanced graphics to real-time data binding.

"HTML5 Data and Services Cookbook" starts with the display of text and related data. Then you will be guided through graphs and animated visualizations followed by input and input controls.

Data serialization, validation and communication with the server as well as modern frameworks with advanced features like automatic data binding and server communication will also be covered in detail.This book covers a fast track into new libraries and features that are part of HTML5!

Authors

Gorgi Kosev

Gorgi Kosev is the lead software engineer at CreationPal, where he currently works on development of mobile and desktop HTML5 applications, as well as cloud solutions based on Node.js. He is also responsible for the selection and development of the technology stack used in CreationPal products, such as SportyPal and Appzer for Google Docs.
He completed his graduation in Electrical Engineering from University of Ss. Cyril and Methodius in 2008, and his Masters in Intelligent Information Systems in 2011. His research interests includes collaborative computer systems and machine learning.
In his spare time, he enjoys sharing code and hardware hacks with members of the local hack lab and playing the piano.

Mite Mitreski

Mite Mitreski works on custom enterprise application development with primary focus on Java and JVM-based solutions. He has worked as a programming course trainer in the past. He is deeply involved in activities surrounding development groups in Macedonia, where he is currently the JUG Leader of Java User Group, Macedonia. Mite has a great passion for free and open source software, open data formats, and the open web. Occasionally, he writes at his blog at http://blog.mitemitreski.com and can be reached on Twitter, his Twitter handle being @mitemitreski.

Alerts & Offers

Series & Level

We understand your time is important. Uniquely amongst the major publishers, we seek to develop and publish the broadest range of learning and information products on each technology. Every Packt product delivers a specific learning pathway, broadly defined by the Series type. This structured approach enables you to select the pathway which best suits your knowledge level, learning style and task objectives.

Learning

As a new user, these step-by-step tutorial guides will give you all the practical skills necessary to become competent and efficient.

Beginner's Guide

Friendly, informal tutorials that provide a practical introduction using examples, activities, and challenges.

Essentials

Fast paced, concentrated introductions showing the quickest way to put the tool to work in the real world.

Cookbook

A collection of practical self-contained recipes that all users of the technology will find useful for building more powerful and reliable systems.

Blueprints

Guides you through the most common types of project you'll encounter, giving you end-to-end guidance on how to build your specific solution quickly and reliably.

Mastering

Take your skills to the next level with advanced tutorials that will give you confidence to master the tool's most powerful features.

Starting

Accessible to readers adopting the topic, these titles get you into the tool or technology so that you can become an effective user.

Progressing

Building on core skills you already have, these titles share solutions and expertise so you become a highly productive power user.