I’ll be participating in writing a new book on the enterprise development with HTML5. At this point we have created only the first cut of mind map (we use MindMeister software) that includes a TOC with very brief description of the chapters.
This is a work in progress and every bit of it may change. But the main idea is that we’re going to build a sample Web site Save a Child and will describe and comment on this process Everything is a work in progress and subject to change. So far we haven’t submitted an official proposal to any book publisher yet, but we will. Below is the text as it was exported by MindMeister. Your feedback is greatly appreciated.
Part 1. Desktop
Ch1. HTML5 and its New APIs
Provide a brief overview of all APIs that are included in HTML5 spec (Web Storage, WebSQL, Web Sockets, Web Workers). List the browsers supporting HTML5. Is it safe to start an HTML5 project since not all Web browsers fully support HTML5?
Ch2. Mocking Up the “Save a Child” Web Site
Create a mock up of the sample Web site Save a Child that supports donations to ill children. The Web site has to support videos, images and be integrated with some payments system. The mockup should include three versions of the UI: desktop, tablet, smart phone.
By the end of this chapter the HTML version of Save a Child is ready with hardcoded data.
Ch4. Using Ajax and JSON
After explaining the JSON data format we’ll deploy Save a Child under the remote Tomcat server on one of our servers. We’ll also provide the instructions on installing Tomcat on the local machine for those readers who want to do it.
Then goes the explanation of the AJAX way of retrieving data from the remote server without the need to refresh the entire page.
In the final version of the Web site the data feed will be organized by a Java program deployed under a Java EE server – we’ll use Oracle’s GlassFish 4.0 for being the leader in implementing all the latest Java EE specifications.
The chapter starts with a brief overview of available test frameworks. Then, it explains how to set up a new Save a Child project in the IDE using selected test framework.
Ch6. “Save a Child” with JQuery framework
In this chapter we’ll start introducing JQuery framework to Save a Child code developed in chapters 2-5. While this chapter won’t have a formal tutorial on the JQuery framework, we’ll briefly explain its basics and each component that’ll be used in Save a Child.
CH7 “Save a Child” with Ext JS framework
In this chapter we’ll use some of the code from ch 2-5, but this time we’ll use the Sencha’s Ext JS framework.
The reader will learn the principles of building Web sites with Ext JS.
We’ll demo the use of our own open source generator Clear Data Builder that can generate the EXT JS code based on Java classes.
By the end of this chapter the reader will have working version of the Save a Child Web site. We’ll also compare the pros and cons of its Ext JS and JQuery’s versions.
Ch8. Replacing HTTP with WebSockets
This chapter will introduce the WebSocket API, which is a part of HTML5 spec. We’ll pick one of the data flow in Save a Child site and replace HTTP communication with WebSockets protocol.
Using the monitoring tool we’ll show the performance bandwidth usage benefits that WebSockets protocol brings to the Web.
This chapter will be based on this WebSockets presentation.
CH9. Securing Web Applications
This chapter will add authentication and authorization features for the users Save a child. They will be able to login to this Web site and perform different actions according to their role.
The Save a Chile site is a rather small Web project. But in the enterprise world, lots of applications have a lot larger code base. In this chapter we’ll give an example of how to build modularized Web applications that can load the code on as needed basis. We’ll also give an example of how to organize the data exchange between different modules in a loosely coupled fashion.
Part 2. Mobile
Ch11. Responsive Design: One Site Fits All
The chapter starts with a brief overview of different approaches to making the Web site to the mobile space. One of the approaches is having only one Web site for all devices. This approach is is called Responsive Design, and we’ll modify the design of the Save a Child site to introduce different layouts for the desktop, tablet, and smartphone devices.
By the end of this chapter the site Save a Child will automatically change its layout based on the user’s device without the losing any functionality.
Ch12. “Save a Child” With JQuery Mobile
This chapter will demonstrate how to build the mobile version of Save a Child using JQuery Mobile framework.
Ch13. “Save a Child” with Sencha Touch
This chapter will demonstrate how to build the mobile version of Save a Child using the Sencha Touch framework.
Ch14. Hybrid Applications: HTML + Native API
This chapter explains how to add the bridge HTML and native mobile API with the Phone GAP framework. It’ll add the GPS service to the mobile version of “Save a Child”.
Proponents of the native mobile applications suggest that having direct access to all native api offered by a mobile device (camera, contacts, GPS et al.) is a must have. This chapter explains how to bridge HTML and native mobile API using the Phone GAP framework to have the best of both worlds. It’ll add the GPS service to the mobile version of “Save a Child”.
This chapter/book will end describing our vision of the most efficient way of making your existing Web application to thousands different mobile devices at a reasonable cost.