This course shows you how to convert web pages to Progressive Web Apps (PWAs). PWA use a web-development approach that combines tools and technologies to create targeted, ideal user experiences on mobile devices. PWAs use service workers, modern browser APIs, and an application shell architecture to give users meaningful offline experiences, fast first load, and easy reengagement on repeat visits to the app.
The Developing Progressive Web Apps codelabs provide a guided, hands-on coding experience. Most of the codelabs in the course step you through the process of adding a new feature to an existing app.
To learn more about PWAs, see Progressive Web Apps on the Google Developers website.
To learn about other training created by the Google Developers Training team, visit Google Developers Training.
The Developing Progressive Web Apps course is aimed at beginning-to-intermediate web developers who want to build web experiences that work for everyone. You should have the following skills:
- Comfortable using HTML and CSS
Each codelab lists specific recommended prerequisites.
Starter and solution code
As you work through the codelabs in the course, you use starter and solution code that's provided in the pwa-training-labs repository in GitHub.
Developing Progressive Web Apps includes the following codelabs:
- 1.0 Welcome (this codelab!)
- 2.0 Offline quickstart
- 3.0 Scripting the service worker
- 3.1 Promises
- 3.2 Fetch API
- 4.0 Workbox
- 4.1 Gulp setup
- 5.0 Caching files with the service worker
- 6.0 Cloud Firestore
- 7.0 Integrating Google Analytics
- 8.0 Integrating web push
- 9.0 Responsive design
- 9.1 Responsive images
- 10.0 IndexedDB API
You can complete the codelabs in any order. However, the more advanced codelabs build on the fundamentals covered in the earlier codelabs.
Start the Developing Progressive Web Apps course by taking the first codelab, Offline quickstart.
To see all the codelabs in the PWA training course, see the Welcome codelab for the course/