Understanding PWAs

Learn the basics of PWAs and how to make simple apps into Progressive Web Apps.

We'll cover the following

A PWA is a web app that uses modern web capabilities to deliver an app-like experience to users. They look and feel like a native applications because they run in their own app window instead of the browser’s window, and they can be launched from the “Start” menu or taskbar. PWAs offer an offline experience and load instantly due to their use of caching. They can receive push notifications and are automatically updated in the background. Finally, although they do not require a listing in an app store for distribution, they can be distributed through the app stores.

Many large companies, such as Pinterest, Starbucks, Trivago, and Twitter, have embraced PWAs. Companies are drawn to PWAs because they can develop them once and use them everywhere.

A PWA feels like a native application due to a combination of technologies. In order to convert a web app into a PWA, it must use HyperText Transfer Protocol Secure (HTTPS) and include both a manifest file and a service worker.

HTTPS

To be converted into a PWA, the web app must use HTTPS and must be served over a secure network. This should not be a problem since most browsers will no longer serve pages over HTTP. Therefore, even if we are not planning to convert a Blazor WebAssembly app into a PWA, we should always be using HTTPS.

Tip: A Secure Sockets Layer (SSL) certificate is required to enable HTTPS. A great source for free SSL certificates is Let’s Encrypt (https://letsencrypt.org). It is a free, automated, and open Certificate Authority (CA).

Manifest files

A manifest file is a simple JavaScript Object Notation (JSON) document that contains an application’s name, defaults, and startup parameters for when a web application is launched. It describes how an application looks and feels.

This is an example of a simple manifest file:

Get hands-on with 1200+ tech skills courses.