Step 1: Create service worker file

create a blank service-worker.js file in your root folder. And put the below code in your html page, before closing </html> tag.

<script> if ('serviceWorker' in navigator) {    console.log("Will the service worker register?");    navigator.serviceWorker.register('service-worker.js')
      .then(function(reg){        console.log("Yes, it did.");     }).catch(function(err) {        console.log("No it didn't. This happened:", err)    });
 }</script>

Step 2: Create manifest file

create manifest.json file in root folder. Add below tag in your html page header section

<link rel="manifest" href="/manifest.json">

Step 3: Add configurations in manifest file

Here is the configurations we used.

{
  "short_name": "BetaPage",
  "name": "BetaPage",
  "theme_color": "#4A90E2",
  "background_color": "#F7F8F9",
  "display": "standalone",
  "icons": [
    {
      "src": "assets/icons/launcher-icon-1x.png",
      "type": "image/png",
      "sizes": "48x48"
    },
    {
      "src": "assets/icons/launcher-icon-2x.png",
      "type": "image/png",
      "sizes": "96x96"
    },
    {
      "src": "assets/icons/launcher-icon-3x.png",
      "type": "image/png",
      "sizes": "144x144"
    },
    {
      "src": "assets/icons/launcher-icon-4x.png",
      "type": "image/png",
      "sizes": "192x192"
    }
  ],
  "start_url": "/?utm_source=launcher"
}