The jQuery Mobile docs have a lot of hidden gems. They make a great starting point but there are actually several ways of doing your base template. There is the single page template, the multipage template, templates with global configuration, and dynamically generated pages.
So, let's start out with a new jQM single-page boilerplate based on the original single-page template (http://view.jquerymobile.com/1.4.5/demos/pages/). We will evolve this as we move into other chapters so it becomes an all-encompassing template. Following is the basic directory structure we'll create for this chapter and the files we'll use:
For now, here is the base HTML; let's store it in
template.html:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1.0, user-scalable=no">
<link rel="stylesheet" href="css/jquery.mobile-1.4.5.css" />
<...