Speaker Deck

Offline Sync for Progressive Web Apps Workshop at Empire Conf

by Bradley Holt

Published October 12, 2017 in Programming

With the introduction of Progressive Web Apps and browser APIs such as persistent storage, payments, geolocation, and push notifications, it is now possible to build fully-featured mobile apps on the web platform. One important aspect of Progressive Web Apps is the concept of building your app to be Offline First. With an Offline First approach, you design your app for the most resource-constrained environment first. This approach provides a consistent user experience whether the user's device has no connectivity, limited connectivity, or great connectivity. One of the biggest benefits of Offline First apps is that they can be very fast, as they provide zero-latency access to content and data stored directly on the device.

The Service Worker API can do most of the heavy lifting when it comes to storing URL-addressable content and assets for Offline First Progressive Web Apps. A bigger challenge can be storing and sync'ing your app's data. One of the best answers today for offline sync for Progressive Web Apps is a combination of Apache CouchDB (an open source document database), Hoodie (an open source Node.js backend for Offline First apps), and PouchDB (an open source JavaScript database that syncs). This stack can provide you with the starting point for your own Progressive Web App mobile backend and frontend, and it's entirely open source! You'll leave this workshop having built a fully-functional Offline First Progressive Web Apps using Service Workers, Apache CouchDB, Hoodie, and PouchDB. Some prerequisite knowledge of building web apps with JavaScript will be helpful for participants.