How to Build a jQuery Mobile Application

I wrote How to Build a jQuery Mobile Application to help you learn how to create apps with jQuery Mobile. The book will guide you, step by step, through the process of building a jQuery Mobile application. If you like to learn by doing, this is a book for you.

Besides helping you learn jQuery Mobile in a short time, the book will give you comprehensive advice that you can use when developing your own applications.

This is exactly what I was looking for. Wonderfully crafted tutorial, with source code…. thanks a bunch!!

Steve, via comment on MiamiCoder.com

You Will Learn the Essential Skills of a Successful jQuery Mobile Developer

The book will teach you the essential skills you need to succeed developing apps with jQuery Mobile. Here’s a summary:

jQuery Mobile pages, dialogs, and navigation: Pages and dialogs are the foundation of a jQuery Mobile user interface. The book will teach you how to create them, and how to implement page navigation using toolbar buttons, links, and list view items.

List view and master-detail user interfaces: Rendering collections of similar items is a very common occurrence in mobile applications. The book will teach you how to create jQuery Mobile list views using both markup and JavaScript code. It will also show you how to style list items, and how to connect a list with a form in order to build a master-detail user interface.

Capturing user input: Most mobile applications require some form of user input. The book explains how you can use form elements to capture input, how to validate this input, and how to alert users when validation fails.

Saving application data on the device: An important factor that contributes to the usability of your application is its ability to store data on the mobile device. The book will teach you how to use jQuery Mobile and HTML5’s local storage to save application data, making it available across browser sessions.

Synchronizing application data with a server: Regardless of the purpose of your application, at some point you will face the need to keep its data in sync with a server. This is why the book will teach you how to create and handle AJAX requests, as well as implement synchronization logic based on time stamps applied to the data models of the application.

Separation of business logic from user interface: Who wants to work on a mobile application that is expensive to develop and does not sell well? The book will show you how to keep the user interface and the business logic of the application separate, and how to create test cases for the business logic. These practices make your applications more maintainable and reduce development costs.

Each Chapter Teaches Principles and Practices You Can Use In Your Own Apps

Chapter 1: Introducing the Notes Application
In this chapter we will establish the overall design of the application, define its features, and create the low fidelity user interface mock-ups that will help us build the app’s main views and associated business logic.

Chapter 2: Creating The Notes List
Here we will learn how jQuery Mobile does its magic, and how to create a jQuery Mobile list view programmatically. We will also build the app’s main page, and the module responsible for handling events generated in the application’s views.

Chapter 3: Retrieving and Rendering Cached Notes
In this chapter we will learn how to retrieve data from HTML5’s local storage. In addition, we will start building the data access module of the application. We will follow a behavior-driven approach while building this module, first defining expectations for its behavior, and then adding features that fulfill these expectations. On the user interface side, we will learn how to modify the look and feel of jQuery Mobile list views.

Chapter 4: Creating the Note Editor Page
This is where we will learn how to create a jQuery Mobile form, how to load data into the form, and how to save form data to HTML5’s local storage. We will also learn how to create jQuery Mobile dialogs, and how to create a custom jQuery Mobile theme swatch.

Chapter 5: Synchronizing With the Server
In this chapter we will modify the application so it can keep its data synchronized with a server. In the process, we will learn how to create and handle the AJAX requests that allow communications with a server. We will write two versions of the code for the server handler, one using PHP, and one using C#. Finally, we will learn how to conditionally modify the visual style of the items in a jQuery Mobile list view.

Table of Contents

Chapter 1: Introducing the Notes Application

• What You Will Learn In this Book
• The Development Approach
• Features of the Notes App
• Designing the Notes List
• Designing the Note Editor
• Where Are We?

Chapter 2: Creating The Notes List

• What You Will Learn In This Chapter
• The Application’s Directories and Files
• How jQuery Mobile Works
• The Notes List jQuery Mobile Page
• Defining the Controller Module
• How To Execute Code after A jQuery Mobile Page Loads
• Creating a jQuery Mobile List Programmatically
• Where Are We?

Chapter 3: Retrieving and Rendering Cached Notes

• What You Will Learn In This Chapter
• Defining And Testing the Application’s Business Logic
• Getting Ready to Use Jasmine
• The dataContext Module
• The Note Model
• Retrieving Cached Notes from Local Storage
• Testing With Data by Retrieving a List of Dummy Notes
• Rendering Cached Notes
• How to Style List Items
• Grouping Notes By Date
• Where Are We?

Chapter 4: Creating the Note Editor Page

• What You Will Learn In This Chapter
• Creating the Note Editor Page
• Loading a Note in the Editor
• Saving a Note
• Getting Ready to Validate a Data Model
• How to Create a Dialog With jQuery Mobile
• Creating a Confirmation Dialog
• Deleting a Note
• Using a Custom Theme Swatch in jQuery Mobile
• Where Are We?

Chapter 5: Synchronizing With the Server

• What You Will Learn In This Chapter
• How Synchronization Will Work
• Creating a Tap Handler for the Sync Button
• Changing jQuery Mobile’s Default Loading Message
• Creating a Test for An Asynchronous Operation
• Passing a Server URL to The dataContext Module
• Beginning the Notes Synchronization
• Adding Synchronization Time Stamps to the Note Model
• Parsing Synchronization Results Sent By the Server
• Using an Icon to Indicate a Note’s Sync Status
• The Server-Side Code, PHP Version
• The Server-Side Code, C# Version
• Where Are We?
• We Made It!
• Keep in Touch

Plenty of Source Code and Images to Guide You

How to Build a jQuery Mobile Application is peppered with images and source code listings that will help you understand the concepts and principles explained. The book comes with a source code bundle containing the finished application, as well as incremental versions featuring the application’s code as it stands at the end of each chapter. If you choose to build the app as you read, you will be able to easily measure your progress by comparing your source to the bundled incremental versions for each chapter.

60 Day Money Back Guarantee

If you are not happy with the book for any reason, please let me know via email (miamicoder[AT]gmail.com) within 60 days of the date of purchase. I will refund your purchase price in full, no questions asked.

Download Now

• Instant download of eBook and source code bundle with code for finished application, plus each chapter’s code
• Pay by PayPal or Credit Card
• 60 Day Money Back Guarantee

The Brains Behind the eBook