BUILD A DATA-RICH PROGRESSIVE WEB APP

摘要

In this tutorial, we'll use a contacts app as an example for how to implement offline data storage. We'll then look at using background sync to handle failed network requests and available methods to keep the user informed. For data-driven apps using a service worker, IndexedDB is great. We'll also use Dexie for IndexedDB's power in a promise-based interface. In order to keep the multiple JavaScript contexts in sync, we'll use a shared setup file for the database. In dexie-setup.js, we define the Object stores and versions we need. Let's add a new store for our app: const db = new Dexie('pwa-tutorial'); db.version(1).stores({ contacts: 'id, name, email, phone' }); We have one version to start but if we changed the data structure after launching the app, we'd want to add a new version with each new store, as well as an upgrade function. For now, adding the four columns to match our contacts data in db.json is fine.