This is the SimplePWA addition stuff.
A Progressive Web App (PWA) is a great thing. On something like your phone, it looks, feels, and acts like a regular phone app. However...
- Whereas an app downloaded onto your phone takes up a bunch of your phone's storage space, a PWA takes very little space.
- It looks, acts, and feels just like a regular app.
- Updates done to the app are instantaneous. There's no need to "update."
- You're free from a big corporation's app store and their rules and whims.
The PureDogPWA relies heavily on the SimplePWA.com template. That site links to very helpful tools in setting up proper images for your PWA as well.
Essentials of a PWA
It's possible to "Add to home screen" any website. But, all this does is add an icon/image to your device. The icon is just a link to the web page. Tapping the icon then opens the page in a new tab in your web browser. When you close the browser, it's gone. This is handy, but it's not exactly a PWA.
In its essence, the main qualifier of a PWA is that it can be installed on your device. Then, it opens in its own screen, separate from your brower. When you close your browser, the PWA is still there, just like an app would be. Turning a website into a PWA requires the following things:
- HTML code, like any website.
- A line of code in the head that includes: link rel="manifest" href="manifest.json". Add it to each page in the head.
- A manifest. It's named "manifest.json" and you should customize it.
- A service worker. This is a javascript file named "sw.js" and doesn't need to be changed.
Try it
Try to make a PWA. Either mash up this PureDogPWA or try SimplePWA.com linked above.