PWA Recipe: Custom Offline Page for Drupal 8 Without a Single Line of Code
Who said that Progressive Web App (PWA) concepts are hard to implement or Drupal 8 is not ready for PWA? Here is a simple recipe to prove them wrong.
- Install SSL certificate (or use localhost).
- Install Service Worker Registration module.
- Copy service-worker.js, offline.html and manifest.json from GoogleChrome/samples to your site root (Apache 2.0 license).
- Adapt manifest.json and offline.html to your needs.
- Register service-worker.js through Service Worker Registration.
- In about 15 seconds, turn off your Internet connection (or your web server in case of localhost) and reload the site page.
- You should see your offline.html displayed.
- Congrats! Your site is a PWA now.
If you want to dig deeper, run Chrome Dev Tools -> Audits (Lighthouse) and fix the issues.
This recipe has been crafted for my presentation at DrupalCamp Krasnodar 2017.