Implement PWA with offline support.

abadi199 · Feb 1, 2020 · c5025e2 · c5025e2
1 parent bc5c341
commit c5025e2
Show file tree

Hide file tree

Showing 6 changed files with 544 additions and 10 deletions.
diff --git a/index.html b/index.html
@@ -1,12 +1,26 @@
 <html>
-  <body>
-    <div id="app"></div>
-    <script src="./src/index.re"></script>
-    <link rel="manifest" href="./manifest.webmanifest" />
+  <head>
+    <link rel="manifest" href="/manifest.webmanifest" />
     <link
       href="https://fonts.googleapis.com/css?family=Quicksand&display=swap"
       rel="stylesheet"
     />
-    <link rel="stylesheet" href="./src/style.scss" />
-  </body>
+    <link rel="stylesheet" href="/src/style.scss" />
+  </head>
+  <body>
+    <div id="app"></div>
+    <script src="/src/index.re"></script> 
+    <script>
+		if ('serviceWorker' in navigator) {
+      const sw = "sw.js";
+			navigator.serviceWorker.register(sw)
+				.then(function(registration) {
+					console.log('Registration successful, scope is:', registration.scope);
+				})
+				.catch(function(error) {
+					console.log('Service worker registration failed, error:', error);
+				});
+		}
+  	</script>
 </html>
+
diff --git a/manifest.webmanifest b/manifest.webmanifest
@@ -16,7 +16,6 @@
   "start_url": "",
   "background_color": "#DFDFDF",
   "display": "standalone",
-  "scope": "",
   "orientation": "landscape",
   "theme_color": "#FFA229"
 }