Browse Library
Sign In Start Free Trial
Close icon Search icon
Account
Browse Library Sign In Start Free Trial

Add to playlist

Create a Playlist

Modal Close icon
You need to login to use this feature.
  • Book Overview & Buying HTML5 Web Application Development By Example : Beginner's guide
  • Table Of Contents Toc
HTML5 Web Application Development By Example : Beginner's guide

HTML5 Web Application Development By Example : Beginner's guide

By : Jody Gustafson
4.3 (4)
Buy this Book
close
close
HTML5 Web Application Development By Example : Beginner's guide

HTML5 Web Application Development By Example : Beginner's guide

4.3 (4)
By: Jody Gustafson
Buy this Book

Overview of this book

HTML5's new features have made it a real application development platform with widespread adoption throughout the industry for this purpose. Being able to create one application that can run on virtually any device from phone to desktop has made it the first choice among developers. Although JavaScript has been around for a while now, it wasn't until the introduction of HTML5 that we have been able to create dynamic, feature-rich applications rivaling those written for the desktop. HTML5 Web Application Development By Example will give you the knowledge you need to build rich, interactive web applications from the ground up, incorporating the most popular HTML5 and CSS3 features available right now. This book is full of tips, tools, and example applications that will get you started writing your own applications today. HTML5 Web Application Development By Example shows you how to write web applications using the most popular HTML5 and CSS3 features. This book is a practical, hands-on guide with numerous real-world and relevant examples. You will learn how to use local storage to save an application's state and incorporate CSS3 to make it look great. You will also learn how to use custom data attributes to implement data binding. We'll use the new Canvas API to create a drawing application, then use the Audio API to create a virtual piano, before turning it all into a game. The time to start using HTML5 is now. And HTML5 Web Application Development by Example will give you the tips and know-how to get started.
Table of Contents (13 chapters)
close
close
close
Preface
chevron up
Icon
Preface
Icon
What this book covers
Icon
What you need for this book
Icon
Who this book is for
Icon
Conventions
Icon
Time for action – heading
Icon
Reader feedback
Icon
Customer support
Lock Free Chapter
1
1. The Task at Hand
Icon
1. The Task at Hand
Icon
The components of an HTML5 application
Icon
Time for action – creating the HTML file
Icon
Time for action – creating the CSS file
Icon
Time for action – creating the JavaScript file
Icon
Creating our first application
Icon
Time for action – creating a tasklist
Icon
Time for action – removing a task from the list
Icon
Time for action – moving tasks within the list
Icon
HTML templates
Icon
Time for action – implementing a template
Icon
Time for action – editing a task in the list
Icon
Saving the state of the application
Icon
Time for action – creating a localStorage wrapper
Icon
Time for action – storing the tasklist
Icon
Time for action – loading the tasklist
Icon
Summary
2
2. Let's Get Stylish
Icon
2. Let's Get Stylish
Icon
CSS3 overview
Icon
Rounded corners
Icon
Shadows
Icon
Time for action – styles in action
Icon
Backgrounds
Icon
Time for action – adding a gradient and button images
Icon
Transitions
Icon
Transforms
Icon
Time for action – effects in action
Icon
Dynamic stylesheets
Icon
Time for action – adding a theme selector
Icon
Filling the window
Icon
Time for action – expanding the application
Icon
Summary
3
3. The Devil is in the Details
Icon
3. The Devil is in the Details
Icon
HTML5 input types
Icon
Task details
Icon
Time for action – adding task details
Icon
Time for action – hiding task details
Icon
Custom data attributes
Icon
Data binding with custom attributes
Icon
Time for action – building a data model
Icon
Time for action – implementing the bindings
Icon
Time for action – loading the task list
Icon
Queuing up changes
Icon
Time for action – delaying the saves
Icon
Summary
4
4. A Blank Canvas
Icon
4. A Blank Canvas
Icon
HTML5 canvas
Icon
Getting a context
Icon
Canvas basics
Icon
Canvas pad
Icon
Time for action – creating a canvas pad
Icon
Time for action – showing the coordinates
Icon
Drawing lines
Icon
Time for action – using the mouse to draw
Icon
Changing context properties
Icon
Time for action – adding context properties
Icon
Creating a toolbar
Icon
Time for action – creating a toolbar
Icon
Time for action – implementing a reusable toolbar
Icon
Adding a toolbar
Icon
Time for action – adding the toolbar object
Icon
Time for action – initializing menu items
Icon
Adding drawing actions
Icon
Time for action – creating drawing actions
Icon
Time for action – saving and restoring
Icon
Adding drawing tools
Icon
Time for action – adding a line tool
Icon
Time for action – adding a rectangle tool
Icon
Time for action – adding a circle tool
Icon
Summary
5
5. Not So Blank Canvas
Icon
5. Not So Blank Canvas
Icon
Drawing text
Icon
Time for action – adding a text tool
Icon
Transformations
Icon
Time for action – adding an Ellipse tool
Icon
Time for action – exporting an image
Icon
Handling touch events
Icon
Time for action – adding touch event handlers
Icon
Photo Pad
Icon
Time for action – creating Photo Pad
Icon
The File API
Icon
Time for action – loading an image file
Icon
Adding effects
Icon
Time for action – the imageEffects object
Icon
Time for action – black and white
Icon
Time for action – sepia
Icon
Image distortion
Icon
Time for action – making waves
Icon
Summary
6
6. Piano Man
Icon
6. Piano Man
Icon
HTML5 audio overview
Icon
Loading audio files
Icon
Time for action – creating an AudioManager object
Icon
HTML5 piano application
Icon
Time for action – creating a virtual piano
Icon
Time for action – loading the notes
Icon
Time for action – playing the notes
Icon
Keyboard events
Icon
Time for action – adding keyboard events
Icon
Volume and sustain controls
Icon
Time for action – adding a sustain control
Icon
Time for action – adding a volume control
Icon
Audio tools
Icon
Summary
7
7. Piano Hero
Icon
7. Piano Hero
Icon
Creating Piano Hero
Icon
Time for action – creating the splash panel
Icon
Time for action – creating the game panel
Icon
Time for action – creating the controller
Icon
Creating an audio sequencer
Icon
Time for action – creating AudioSequencer
Icon
Playing a song
Icon
Time for action – adding the audio sequencer
Icon
Creating animated notes
Icon
Time for action – adding notes
Icon
Time for action – animating the notes
Icon
Handling user input
Icon
Time for action – checking the notes
Icon
Ending the game
Icon
Time for action – creating the results panel
Icon
Summary
8
8. A Change in the Weather
Icon
8. A Change in the Weather
Icon
Introduction to Ajax
Icon
Time for action – creating a weather widget
Icon
Time for action – getting XML data
Icon
Time for action – getting JSON data
Icon
HTML5 Geolocation API
Icon
Time for action – getting geolocation data
Icon
Using web services
Icon
Time for action – calling the weather service
Icon
Summary
9
9. Web Workers Unite
Icon
9. Web Workers Unite
Icon
Web workers
Icon
Time for action – using a web worker
Icon
The Mandelbrot set
Icon
Time for action – implementing the algorithm
Icon
Creating a Mandelbrot application
Icon
Time for action – creating a Mandelbrot application
Icon
Time for action – Mandelbrot using a web worker
Icon
Debugging web workers
Icon
Summary
10
10. Releasing an App into the Wild
Icon
10. Releasing an App into the Wild
Icon
Combining and compressing JavaScript
Icon
Time for action – creating a release script
Icon
HTML5 Application Cache
Icon
Time for action – creating a cache manifest
Icon
Summary
11
A. Pop Quiz Answers
Icon
Chapter 1, The Task at Hand
Icon
Chapter 2, Let's Get Stylish
Icon
Chapter 3, The Devil is in the details
Icon
Chapter 4, A Blank Canvas
Icon
Chapter 5, Not So Blank Canvas
Icon
Chapter 6, Piano Man
Icon
Chapter 7, Piano Hero
Icon
Chapter 8, A Change in the Weather
Icon
Chapter 9, Web Workers Unite
Icon
Chapter 10, Releasing an App into the Wild
12
Index
Icon
Index

Customer support

Now that you are the proud owner of a Packt book, we have a number of things to help you to get the most from your purchase.

Downloading the example code

You can download the example code files for all Packt books you have purchased from your account at http://www.packtpub.com. If you purchased this book elsewhere, you can visit http://www.packtpub.com/support and register to have the files e-mailed directly to you.

Errata

Although we have taken every care to ensure the accuracy of our content, mistakes do happen. If you find a mistake in one of our books—maybe a mistake in the text or the code—we would be grateful if you would report this to us. By doing so, you can save other readers from frustration and help us improve subsequent versions of this book. If you find any errata, please report them by visiting http://www.packtpub.com/submit-errata, selecting your book, clicking on the errata submission form link, and entering the details of your errata. Once your errata are verified, your submission will be accepted and the errata will be uploaded to our website, or added to any list of existing errata, under the Errata section of that title.

Piracy

Piracy of copyright material on the Internet is an ongoing problem across all media. At Packt, we take the protection of our copyright and licenses very seriously. If you come across any illegal copies of our works, in any form, on the Internet, please provide us with the location address or website name immediately so that we can pursue a remedy.

Please contact us at with a link to the suspected pirated material.

We appreciate your help in protecting our authors, and our ability to bring you valuable content.

Questions

You can contact us at if you are having a problem with any aspect of the book, and we will do our best to address it.

CONTINUE READING
83
Tech Concepts
36
Programming languages
73
Tech Tools
Icon Unlimited access to the largest independent learning library in tech of over 8,000 expert-authored tech books and videos.
Icon Innovative learning tools, including AI book assistants, code context explainers, and text-to-speech.
Icon 50+ new titles added per month and exclusive early access to books as they are being written.
HTML5 Web Application Development By Example : Beginner's guide
Next Chapter
notes
bookmark Notes and Bookmarks search Search in title playlist Add to playlist font-size Font size

Change the font size

margin-width Margin width

Change margin width

day-mode Day/Sepia/Night Modes

Change background colour

Close icon Search
Country selected
Close icon Your notes and bookmarks

Confirmation

Modal Close icon
claim successful
Order Page Read Now

Buy this book with your credits?

Modal Close icon
Are you sure you want to buy this book with one of your credits?
Close
YES, BUY

Submit Your Feedback

Modal Close icon
Modal Close icon
Modal Close icon