# Installation experience — Progressive Web Apps

Source: https://www.geekswithgeeks.com/en/pwa/pwa-installation

> Implement install prompts and handling to let users add your PWA to their home screen.

## The installation flow

Browsers show an install prompt when criteria are met: HTTPS, valid manifest, service worker, and icon. You can customize when and how the prompt appears to users.

## Handle install prompt

Listen to beforeinstallprompt event to show a custom install button.

```javascript
let deferredPrompt;

window.addEventListener('beforeinstallprompt', e => {
  e.preventDefault();
  deferredPrompt = e;
  // Show your custom install button
  installBtn.style.display = 'block';
});

installBtn.addEventListener('click', () => {
  deferredPrompt.prompt();
  deferredPrompt.userChoice.then(choice => {
    if (choice.outcome === 'accepted') {
      console.log('App installed!');
    }
  });
});
```

Output:

```
Custom install button triggers native install prompt on click.
```

## A common trap

Only show install prompts after users engage with your app. Too-eager prompts are dismissed and cannot be shown again for several days.

## Installation metrics and analytics

Track installation rates and monitor user engagement with installed apps.