Build a Progressive Web App with vanilla HTML, CSS and Javascript

A Progressive Web App (PWA) is a web application that uses modern web capabilities to deliver an enhanced app-like experience to users. This template provides a basic structure for creating a Progressive Web App (PWA) using vanilla HTML, CSS, and JavaScript.

To get started, clone this repo and begin by editing this index.html file with your HTML content. 3 favicons have been provided, you can add your own if you want. At least 1 favicon is necessary for a PWA to be installable.

Add your CSS and JS files in the assets directory.

The serviceworker.js file is necessary to enable installation of a PWA. It registers the scope for caching of assets.

Edit the manifest.json file with the name and description of your project.

On Chromium based browsers, Richer Install is supported. You can add screenshots of your web app in the manifest.json file to enable it.

If you want to learn more, Mozilla Developer Network (MDN) and web.dev are good resources.

[MDN] What is a Progressive Web App?
[web.dev] Learn more about PWA