diff --git a/web/package-lock.json b/web/package-lock.json
index af5be2a..0cdb95d 100644
--- a/web/package-lock.json
+++ b/web/package-lock.json
@@ -15,6 +15,7 @@
         "markdown-it": "^14.0.0",
         "moment": "^2.29.4",
         "pinia": "^2.1.7",
+        "register-service-worker": "^1.7.2",
         "vue": "^3.4.8",
         "vue-router": "^4.2.5",
         "vuetify": "^3.5.4"
@@ -1235,6 +1236,11 @@
         "node": ">=6"
       }
     },
+    "node_modules/register-service-worker": {
+      "version": "1.7.2",
+      "resolved": "https://registry.npmjs.org/register-service-worker/-/register-service-worker-1.7.2.tgz",
+      "integrity": "sha512-CiD3ZSanZqcMPRhtfct5K9f7i3OLCcBBWsJjLh1gW9RO/nS94sVzY59iS+fgYBOBqaBpf4EzfqUF3j9IG+xo8A=="
+    },
     "node_modules/rollup": {
       "version": "4.18.0",
       "resolved": "https://registry.npmjs.org/rollup/-/rollup-4.18.0.tgz",
diff --git a/web/package.json b/web/package.json
index b9baeff..60896cb 100644
--- a/web/package.json
+++ b/web/package.json
@@ -16,6 +16,7 @@
     "markdown-it": "^14.0.0",
     "moment": "^2.29.4",
     "pinia": "^2.1.7",
+    "register-service-worker": "^1.7.2",
     "vue": "^3.4.8",
     "vue-router": "^4.2.5",
     "vuetify": "^3.5.4"
diff --git a/web/src/main.ts b/web/src/main.ts
index 078da56..8dc1032 100644
--- a/web/src/main.ts
+++ b/web/src/main.ts
@@ -8,6 +8,8 @@ import { registerPlugins } from "./plugins";
 import { Auth0Plugin } from "@auth0/auth0-vue";
 import { Router } from "vue-router";
 
+import "@/registerServiceWorker";
+
 const pinia = createPinia();
 
 import App from "./App.vue";
diff --git a/web/src/registerServiceWorker.ts b/web/src/registerServiceWorker.ts
new file mode 100644
index 0000000..0880797
--- /dev/null
+++ b/web/src/registerServiceWorker.ts
@@ -0,0 +1,26 @@
+import { register } from "register-service-worker";
+
+register("/serviceWorker.js", {
+  registrationOptions: { scope: "./" },
+  ready(registration) {
+    console.log("Service worker is active.");
+  },
+  registered(registration) {
+    console.log("Service worker has been registered.");
+  },
+  cached(registration) {
+    console.log("Content has been cached for offline use.");
+  },
+  updatefound(registration) {
+    console.log("New content is downloading.");
+  },
+  updated(registration) {
+    console.log("New content is available; please refresh.");
+  },
+  offline() {
+    console.log("No internet connection found. App is running in offline mode.");
+  },
+  error(error) {
+    console.error("Error during service worker registration:", error);
+  },
+});
diff --git a/web/src/serviceWorker.js b/web/src/serviceWorker.js
new file mode 100644
index 0000000..984f722
--- /dev/null
+++ b/web/src/serviceWorker.js
@@ -0,0 +1,19 @@
+/* eslint-disable no-undef, no-restricted-globals */
+
+// This is the code piece that GenerateSW mode can't provide for us.
+// This code listens for the user's confirmation to update the app.
+self.addEventListener('message', event => {
+  console.log(event);
+  if (event.data && event.data.type === 'SKIP_WAITING') {
+    self.skipWaiting();
+  }
+});
+
+console.log("Loading serviceWorker.js")
+
+//workbox.clientsClaim();
+
+// The precaching code provided by Workbox.
+self.__precacheManifest = [].concat(self.__precacheManifest || []);
+workbox.precaching.suppressWarnings();
+workbox.precaching.precacheAndRoute(self.__precacheManifest, {});
\ No newline at end of file
diff --git a/web/tsconfig.json b/web/tsconfig.json
index d694a0d..6794808 100644
--- a/web/tsconfig.json
+++ b/web/tsconfig.json
@@ -18,6 +18,6 @@
       "@models": ["../api/src/data/models"]
     }
   },
-  "include": ["src/**/*.ts", "src/**/*.d.ts", "src/**/*.tsx", "src/**/*.vue"],
+  "include": ["src/**/*.ts", "src/**/*.d.ts", "src/**/*.tsx", "src/**/*.vue", "src/serviceWorker.js"],
   "references": [{ "path": "./tsconfig.node.json" }]
 }