# Installation experience — Progressive Web Apps: Offline, Installable Web Apps

Source: https://www.skillbyai.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 installability criteria are met: HTTPS, a valid manifest with name, icons and start_url, and (on some browsers) a service worker. You can customize when and how the prompt appears.

## 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.