Table of Contents
For developing the apps, simply follow the sequence of seven steps described in the tutorial:
Step 1 - Set up the Folder Structure
Step 2 - Write the Model Code
Step 3 - Initialize the Application
Step 4 - Implement the Retrieve/List All Objects Use Case
Step 5 - Implement the Create Object Use Case
Step 6 - Implement the Update Object Use Case
Step 7 - Implement the Delete Object Use Case
Also make sure that
your HTML pages comply with the XML syntax of HTML5, preferably by checking with XHTML5 validation (setting the validator field
Preset to "HTML5 + SVG 1.1 + MathML 3.0"),
international characters are supported by using UTF-8 encoding for all HTML files,
If you have any questions about how to carry out the following projects, you can ask them on our discussion forum.
If you would like to work on these practice projects with the guidance of a coach, then you should enrol in the introductory online course (book parts 1-3) offered by our partner developer-competence.com.
The purpose of the app to be developed is managing information about movies. The app deals
with just one object type:
Movie, as depicted in Figure 4.1 below. In the subsequent parts of the tutorial, you will extend this
simple app by adding integrity constraints, further model classes for actors and directors, and
the associations between them.
releaseDate is an attribute with range
Date, so you
should use the HTML
<time> element in the list
objects table, as discussed in Section 9.2 above.
You can use the following sample data for testing your app:
Table 4.1. Sample data
|Movie ID||Title||Release date|
Variation: Improve your app by replacing the use of the
localStorage API for
persistent data storage with using the more powerful IndexedDB API.