Aplicación para cualquier entorno

# Aplicación web progresiva
Ir a la navegaciónIr a la búsqueda
Una aplicación web progresiva (PWA por sus siglas en inglés) es un tipo de software de aplicación que se entrega a través de la web, creado utilizando tecnologías web comunes como HTML, CSS y JavaScript. Está destinado a funcionar en cualquier plataforma que use un navegador compatible con los estándares. La funcionalidad incluye trabajar sin conexión, notificaciones push y acceso al hardware del dispositivo, lo que permite crear experiencias de usuario similares a las aplicaciones nativas en dispositivos móviles y de escritorio. Dado que una aplicación web progresiva es un tipo de página web o sitio web conocido como aplicación web, no hay ningún requisito para que los desarrolladores o usuarios instalen las aplicaciones web a través de sistemas de distribución digital como Apple App Store o Google Play.

funete :https://es.wikipedia.org/wiki/Aplicaci%C3%B3n_web_progresiva

En mi caso uso framework php LARAVEL con un packet https://github.com/silviolleite/laravel-pwa

en donde guía paso a paso de forma sencilla el instalación,
tambien y solo queda de hacer los ajustes de reemplazar las imagenes que renderizara la app que esta en public/images/icons/
respetando los nombre,

Eso es fácil, pero quedaría mas vistoso si es que hacemos un modal y ponemos un botón con un evento en donde podremos hacerlo de la misma forma, la función seria

window.onload = (e) => {
// Declare init HTML elements
const buttonAdd = document.querySelector('#buttonAdd');

let deferredPrompt;
window.addEventListener('beforeinstallprompt', (e) => {
  // Prevent Chrome 67 and earlier from automatically showing the prompt
  e.preventDefault();
  // Stash the event so it can be triggered later.
  deferredPrompt = e;
});

// Add event click function for Add button
buttonAdd.addEventListener('click', (e) => {
  // Show the prompt
  deferredPrompt.prompt();
  // Wait for the user to respond to the prompt
  deferredPrompt.userChoice
    .then((choiceResult) => {
      if (choiceResult.outcome === 'accepted') {
        console.log('User accepted the A2HS prompt');
      } else {
        console.log('User dismissed the A2HS prompt');
      }
      deferredPrompt = null;
    });
});

}

fuente:https://developer.mozilla.org/en-US/docs/Web/API/Window/onbeforeinstallprompt

Window.onbeforeinstallprompt
La Window.onbeforeinstallpromptpropiedad es un controlador de eventos para procesar a beforeinstallprompt, que se envía a los dispositivos cuando se le pide a un usuario que "instale" una aplicación web. Su evento asociado puede guardarse para más tarde y usarse para avisar al usuario en un momento más adecuado.

Sintaxis
window.addEventListener("beforeinstallprompt", function(event) { ... });
window.onbeforeinstallprompt = function(event) { ...};
Ejemplo
El siguiente ejemplo usa el beforeinstallpromptevento para hacer operativo un botón de instalación, usando el evento dentro de un controlador de clic.

window.addEventListener("beforeinstallprompt", function(beforeInstallPromptEvent) {
beforeInstallPromptEvent.preventDefault(); // Prevents immediate prompt display

// Shows prompt after a user clicks an "install" button
installButton.addEventListener("click", function(mouseEvent) {
// you should not use the MouseEvent here, obviously
beforeInstallPromptEvent.prompt();
});

installButton.hidden = false; // Make button operable
});