A To-Do app that is mobile optimized. It is deployed on Netlify at http://todo-pwa.netlify.com and its backend is at https://v.gd/mwa_backend (jsonstore).
The todo app without any mobile web optimizations is at https://v.gd/mwa_starter_live and its source code is at https://v.gd/mwa_starter.
Most of the icons are from feather icons. The logo of the app is from Flaticon.
These resources will help if you learn more about this app.
- Babel Standalone - Used to run ES6/JSX code in the browser.
- PWA Introduction - A Google Developers getting started on PWAs.
- Web App Manifest - Introduction to web app manifest.
- Add to Home Screen - Everything about the Add to Home Screen PWA feature along with its criteria.
- Background Sync - A very small, straight-forward article on background sync.
- IDB and IDB Keyval - Promise based interface to interact with IDB.
- Push Notifications - A good guide to have a strong understanding on push notifications. Also, see this codelab.
These resources will help you learn more in the field of mobile web.
- Message passing in workers - Tutorial on how to interact with client from Service Worker. It is helpful in knowing when the sync has completed in the worker.
- Create Amazing Forms - A list of important but specific
inputandformattributes you didn't knew (but always used). - Publishing PWAs on Mobile Stores - An experience/guide on how to publish a PWA on Windows, Apple and Android store.
This is the utlimate mobile web guide. It's actually a list of guides nicely ordered by topics.
- Study Guide for Mobile Web Specialization by Google.