diff --git a/middleware/.env.example b/middleware/.env.example
index ff72858..7899d44 100644
--- a/middleware/.env.example
+++ b/middleware/.env.example
@@ -1,3 +1,4 @@
+WEB_BASE_URL=http://localhost:3000
 R2_ACCOUNT_ID=
 R2_ACCESS_KEY=
 R2_SECRET_KEY=
\ No newline at end of file
diff --git a/middleware/main.py b/middleware/main.py
index c06efc6..8499675 100644
--- a/middleware/main.py
+++ b/middleware/main.py
@@ -1,4 +1,5 @@
 from fastapi import FastAPI, Request, HTTPException
+from fastapi.middleware.cors import CORSMiddleware
 from mangum import Mangum
 from db import DynamoDBManager
 from storage.cloudflare_r2 import CloudflareR2Manager
@@ -16,6 +17,16 @@
 # Load Environment variables
 load_dotenv()
 
+# CORS (Cross Origin Resource Sharing) (for local)
+web_base_url = str(os.getenv("WEB_BASE_URL"))
+app.add_middleware(
+    CORSMiddleware,
+    allow_origins=["*"],
+    allow_credentials=True,
+    allow_methods=["*"],
+    allow_headers=["*"],
+)
+
 # Storage
 BUCKET_NAME = "byteshare-blob"
 storage = CloudflareR2Manager(BUCKET_NAME)
diff --git a/middleware/template.yaml b/middleware/template.yaml
index 6635910..6997744 100644
--- a/middleware/template.yaml
+++ b/middleware/template.yaml
@@ -42,6 +42,7 @@ Resources:
           R2_ACCOUNT_ID: !Ref R2AccountID
           R2_ACCESS_KEY: !Ref R2AccessKey
           R2_SECRET_KEY: !Ref R2SecretKey
+          WEB_BASE_URL: !Ref CorsOrigin
       Events:
         ApiEventWithProxy:
           Type: Api
diff --git a/ui/package-lock.json b/ui/package-lock.json
index 6348acd..cb06bc3 100644
--- a/ui/package-lock.json
+++ b/ui/package-lock.json
@@ -15,6 +15,7 @@
         "@radix-ui/react-progress": "^1.0.3",
         "@radix-ui/react-slot": "^1.0.2",
         "@tanstack/react-table": "^8.11.7",
+        "@vercel/speed-insights": "^1.0.9",
         "appwrite": "^13.0.1",
         "class-variance-authority": "^0.7.0",
         "clsx": "^2.1.0",
@@ -1061,6 +1062,40 @@
       "integrity": "sha512-zuVdFrMJiuCDQUMCzQaD6KL28MjnqqN8XnAqiEq9PNm/hCPTSGfrXCOfwj1ow4LFb/tNymJPwsNbVePc1xFqrQ==",
       "dev": true
     },
+    "node_modules/@vercel/speed-insights": {
+      "version": "1.0.9",
+      "resolved": "https://registry.npmjs.org/@vercel/speed-insights/-/speed-insights-1.0.9.tgz",
+      "integrity": "sha512-f+XFP0O+aZ4Olj9h+BitkB1b4NJQaxtyCb69wWuDxytJHY6Pa4QtZPdBUftHOcajUCHRVeq062fk3MKXKtjNVQ==",
+      "hasInstallScript": true,
+      "peerDependencies": {
+        "@sveltejs/kit": "^1 || ^2",
+        "next": ">= 13",
+        "react": "^18 || ^19",
+        "svelte": "^4",
+        "vue": "^3",
+        "vue-router": "^4"
+      },
+      "peerDependenciesMeta": {
+        "@sveltejs/kit": {
+          "optional": true
+        },
+        "next": {
+          "optional": true
+        },
+        "react": {
+          "optional": true
+        },
+        "svelte": {
+          "optional": true
+        },
+        "vue": {
+          "optional": true
+        },
+        "vue-router": {
+          "optional": true
+        }
+      }
+    },
     "node_modules/acorn": {
       "version": "8.11.3",
       "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.11.3.tgz",
diff --git a/ui/package.json b/ui/package.json
index 2755e64..770deb2 100644
--- a/ui/package.json
+++ b/ui/package.json
@@ -21,6 +21,7 @@
     "@radix-ui/react-progress": "^1.0.3",
     "@radix-ui/react-slot": "^1.0.2",
     "@tanstack/react-table": "^8.11.7",
+    "@vercel/speed-insights": "^1.0.9",
     "appwrite": "^13.0.1",
     "class-variance-authority": "^0.7.0",
     "clsx": "^2.1.0",
diff --git a/ui/src/app/(pages)/features/page.tsx b/ui/src/app/(pages)/features/page.tsx
new file mode 100644
index 0000000..3fa4c0a
--- /dev/null
+++ b/ui/src/app/(pages)/features/page.tsx
@@ -0,0 +1,11 @@
+import React from 'react'
+
+function FeaturesPage() {
+  return (
+    <div className="flex items-center justify-center h-screen">
+      <p>Coming Soon</p>
+    </div>
+  )
+}
+
+export default FeaturesPage
diff --git a/ui/src/app/(pages)/feedback/page.tsx b/ui/src/app/(pages)/feedback/page.tsx
new file mode 100644
index 0000000..260889d
--- /dev/null
+++ b/ui/src/app/(pages)/feedback/page.tsx
@@ -0,0 +1,11 @@
+import React from 'react'
+
+function FeedbackPage() {
+  return (
+    <div className="flex items-center justify-center h-screen">
+      <p>Coming Soon</p>
+    </div>
+  )
+}
+
+export default FeedbackPage
diff --git a/ui/src/app/(pages)/help/page.tsx b/ui/src/app/(pages)/help/page.tsx
new file mode 100644
index 0000000..e4df3c9
--- /dev/null
+++ b/ui/src/app/(pages)/help/page.tsx
@@ -0,0 +1,11 @@
+import React from 'react'
+
+function HelpPage() {
+  return (
+    <div className="flex items-center justify-center h-screen">
+      <p>Coming Soon</p>
+    </div>
+  )
+}
+
+export default HelpPage
diff --git a/ui/src/app/(pages)/layout.tsx b/ui/src/app/(pages)/layout.tsx
index 40721f3..da758f9 100644
--- a/ui/src/app/(pages)/layout.tsx
+++ b/ui/src/app/(pages)/layout.tsx
@@ -2,6 +2,7 @@
 import appwriteService from '@/authentication/appwrite/config'
 import { AuthProvider } from '@/context/authContext'
 import React, { useEffect, useState } from 'react'
+import { SpeedInsights } from '@vercel/speed-insights/next'
 
 const InternalLayout = ({ children }: { children: React.ReactNode }) => {
   const [authorised, setAuthorised] = useState(false)
@@ -18,6 +19,7 @@ const InternalLayout = ({ children }: { children: React.ReactNode }) => {
     <AuthProvider
       value={{ authorised, setAuthorised, statusLoaded, setStatusLoaded }}
     >
+      <SpeedInsights />
       {children}
     </AuthProvider>
   )