Building Your First PWA

Frances Coronel

Progressive Web Apps, or PWAs for short, are a fairly new and evolving concept that is Google-backed and on its way to becoming the new golden web standard. What makes PWAs so special is that they're just ordinary looking websites but they also have the ability to function as a native mobile app would.

You see, native mobile apps you'd normally install from the app store can do things like sending push notifications, work offline, load from the home screen, and so on and so forth. By comparison, mobile-friendly websites accessed in a mobile browser still don't have the capacity to do any of these things.

Progressive Web Apps fix that issue by bringing features we expect from native apps to the mobile browser experience. This means that if a website becomes a PWA, it is using features such as web push notifications and service workers to mimic the same interaction a native mobile app would offer.

In other words, PWAs attempt to combine features offered by most modern browsers with the benefits of the mobile experience. A user can finally get the best of both worlds with the reliability and engagement a native app can provide combined with the performance and lightweight architecture a web app can offer.

Although it may seem quite difficult to implement a PWA, the key technical aspects only involve HTTPS, service workers, and a web app manifest. This implies as long as you serve your site over HTTPS, you have a service worker with some basic caching, and you register a web app manifest with some basic information like the name and at least one icon, your website is recognized as a PWA.

In this workshop, I'll walk you through the steps on transforming an existing website into a PWA from the bottom up and together, we'll explore the wide array of companies that have already benefited from the many enhancements that PWAs offer.

Edit proposal

Submissions

Add submission