Developing Progressive Web Applications

The way we access the Internet has changed. With the growth of mobile devices, millions of people from around the world use the Internet for the first time on a mobile device. Google is supporting Progressive Web Apps (PWAs) to help developers provide native-app qualities in web applications to make them reliable, fast, and engaging.

This course shows you how to convert web pages to PWAs. A PWA is a web development approach using existing tools and technologies to create targeted, ideal user experiences. Students learn how to use service workers, caching, and an application shell architecture. This enables developers to build meaningful offline experiences, fast first load, and easy user re-engagement upon repeat visits.

Are you part of a web development agency in the UK, India, or Indonesia? We're running training courses to help you learn about PWA technologies. Check out Progressive Web App Training for Agencies.

new_releases Latest news

About the course

The course materials include:

Each lesson contains a slide deck, a concepts chapter, and in most cases, hands-on codelabs. The course is approximately one-third lecture and two-thirds practice (in the three-day form). As students work through the exercises, they create apps to practice and perfect the skills they're learning. Some lessons are purely conceptual and do not have codelabs.

The teaching plan is meant to be shared with the class and provides links to each of the lessons' slides, concepts, and codelabs. The instructor's guide provides recommended schedules, options for two- and three-day courses, and advice on customizing the course.

Prerequisites

This course is aimed at:

  • Web developers who are comfortable using HTML and CSS, and who have a modest facility with JavaScript.
  • Developers who want to build web experiences that work for everyone.

How do I take the course?

Contact the Google Developers Training team at developer-training-info@google.com for the current training providers in your region.

Well-motivated learners can also take the course as self-study at developers.google.com/web/ilt/pwa/.

How do I offer the course at my university or college?

If you'd like to offer Developing Progressive Web Applications, contact the Google Developers Training team at developer-training-info@google.com.

What does the course cover?

Developing Progressive Web Applications includes 21 modules organized into three parts (each part is roughly a day):

  1. Introduction to Progressive Web Apps
  2. Building the core of a PWA
  3. Best practices and advanced features

Part 1: Introduction to Progressive Web Apps

Developers often need to make the case for new approaches such as Progressive Web Apps, then create prototypes.

This part of the course explores the customer behaviors that make PWAs an attractive choice, reviews the foundations of good design, dives into the mechanics of responsive design (and responsive images), and introduces the PWA core technologies. This part ends with a hands-on exercise to convert an existing website into a PWA.

Part 2: Building the core of a PWA

The programming techniques in part 1 are suitable for a mostly static site. Incorporating PWA techniques into interactive web applications requires us to go deeper into the technologies and apply some new practices.

This part of the course examines four web technologies (each with a codelab): Promises, the Fetch API, the Cache API, and IndexedDB. You will use these technologies to build an application shell, audit it with Lighthouse, and understand the trade-offs between different PWA architectures.

Part 3: Best practices and advanced features

Now it's time to put some polish on that app! Workbox makes it easy to integrate production-quality cache management code into a PWA. Adding push notifications or web payments can make for a more compelling app. Since a PWA is still a web application, tuning it for SEO and integrating Google Analytics are smart ideas.

After practicing each technology individually, this part ends with a four-part walk-through (with codelabs) of a complete ecommerce app. This ties all of the information together in a realistic example.

Latest news

new_releases Mobile Web Specialist Certification available

By earning a Mobile Web Specialist Certification, you'll set yourself apart from other web developers and demonstrate that you have the skill to create responsive and flexible web apps for any platform.

new_releases PWA Training for Agencies

Google is inviting web development agencies to apply to join an intensive two-day PWA training course in the UK, India, and Indonesia. For details, see Progressive Web App Training for Agencies.