What you'll learn
Quick Answer
Three things make a site installable: a web app manifest, a registered service worker, and HTTPS. That gets you a home screen icon, a standalone window and offline capability, without an app store.
What a PWA actually is
Not a framework, not a build tool, not a new technology. A PWA is an ordinary website that meets a few requirements, which unlocks browser behaviour normally reserved for native apps.
What you get: an icon on the home screen, launching in its own window with no address bar, working offline, and receiving push notifications on supported platforms.
What you avoid: app store review, download size, install friction, and maintaining separate Android and iOS codebases. Users reach it from a link, and updating means deploying your site.
For an Indian audience this matters more than in many markets — install size and data cost are real barriers, and a PWA is typically a fraction of a native app's download.
The manifest
A JSON file describing how the app should appear when installed:
{
"name": "Priodemy Notes",
"short_name": "Notes",
"start_url": "/",
"display": "standalone",
"background_color": "#ffffff",
"theme_color": "#6366f1",
"icons": [
{ "src": "/icon-192.png", "sizes": "192x192", "type": "image/png" },
{ "src": "/icon-512.png", "sizes": "512x512", "type": "image/png" }
]
}
Link it from your HTML:
<link rel="manifest" href="/manifest.json">
Details that decide whether install actually works: display: "standalone" removes the browser chrome; short_name is what appears under the icon, so keep it under about twelve characters; and you genuinely need both the 192 and 512 pixel icons — a missing size is the most common reason a site is not offered for installation.
Forgetting the <link> tag entirely is the second most common reason, and produces no error anywhere.
The other two requirements
HTTPS is mandatory. Service workers can intercept every request the page makes, so allowing that over plain HTTP would let anyone on the network install a permanent interceptor. Localhost is exempted for development — see HTTP vs HTTPS.
A registered service worker is what provides offline capability:
if ("serviceWorker" in navigator) {
window.addEventListener("load", () => {
navigator.serviceWorker.register("/sw.js");
});
}
Registering after the load event keeps it from competing with the initial page render.
The service worker is where most of the complexity lives — enough that it has its own article. See service workers explained.
To check your work, open the browser's developer tools and look at the Application panel. It lists the manifest as parsed, the service worker state, and any reason installation is unavailable, which is far quicker than guessing.
How installation happens
When the criteria are met, browsers may offer installation themselves. You can also control the prompt:
let deferred;
window.addEventListener("beforeinstallprompt", (e) => {
e.preventDefault();
deferred = e;
showMyInstallButton();
});
async function onInstallClick() {
deferred.prompt();
const { outcome } = await deferred.userChoice;
deferred = null;
}
This lets you show an install button at a sensible moment rather than immediately on arrival, which converts considerably better.
Note the platform difference: iOS does not fire beforeinstallprompt. Installation there is manual through the share menu, so provide brief instructions for iOS users rather than a button that does nothing.
What PWAs still cannot do
Worth knowing honestly, because it decides whether a PWA is the right choice.
iOS restricts them. Push notification support arrived late and only for installed apps, storage can be evicted after periods of non-use, and several web APIs are unavailable. On Android, PWAs are far closer to first-class.
Limited hardware access. Camera, geolocation and Bluetooth are available; deep integrations such as background location, contacts or SMS reading are generally not.
No app store presence by default, which for many products is where users look — although you can package a PWA for the Play Store.
Background execution is restricted, so a PWA cannot run continuously the way a native app can.
The honest summary: a PWA is an excellent choice for content, tools, dashboards and anything you would otherwise deliver as a website with an app wrapper. It is the wrong choice for something needing deep device integration or constant background work.
