diff --git a/.gitignore b/.gitignore
index 800cc44..4ab4658 100644
--- a/.gitignore
+++ b/.gitignore
@@ -29,3 +29,10 @@ coverage
 
 test-results/
 playwright-report/
+
+# wrangler files
+.wrangler
+.dev.vars*
+!.dev.vars.example
+.env*
+!.env.example
diff --git a/package.json b/package.json
index a14ca56..c6e4b34 100644
--- a/package.json
+++ b/package.json
@@ -10,7 +10,8 @@
   "scripts": {
     "dev": "vite --port 4730 --host --strictPort",
     "build": "run-p type-check \"build-only {@}\" --",
-    "preview": "vite preview",
+    "preview:vite": "vite preview",
+    "preview": "pnpm run build && wrangler dev",
     "test:unit": "vitest",
     "test:e2e": "playwright test",
     "build-only": "vite build",
@@ -19,10 +20,11 @@
     "lint:eslint": "eslint . --fix",
     "lint": "run-s lint:*",
     "format": "prettier --write src/",
-    "wrangler:deploy:preview": "wrangler pages deploy dist --project-name=vue-ts-example-2025 --branch=preview",
-    "wrangler:deploy:prod": "wrangler pages deploy dist --project-name=vue-ts-example-2025",
-    "deploy:preview": "run-s build-only wrangler:deploy:preview",
-    "deploy:prod": "run-s build-only wrangler:deploy:prod",
+    "-wrangler:pages:deploy:preview": "wrangler pages deploy dist --project-name=vue-ts-example-2025 --branch=preview",
+    "-wrangler:pages:deploy:prod": "wrangler pages deploy dist --project-name=vue-ts-example-2025",
+    "-deploy:preview": "run-s build-only wrangler:pages:deploy:preview",
+    "-deploy:prod": "run-s build-only wrangler:pages:deploy:prod",
+    "deploy": "pnpm run build && wrangler deploy",
     "cf-typegen": "wrangler types"
   },
   "dependencies": {
diff --git a/server/index.ts b/server/index.ts
index 18b51f6..b7f8253 100644
--- a/server/index.ts
+++ b/server/index.ts
@@ -1,12 +1,24 @@
 export default {
-	fetch(request) {
-		const url = new URL(request.url);
+  async fetch(request, env) {
+    const url = new URL(request.url)
 
-		if (url.pathname.startsWith("/api/")) {
-			return Response.json({
-				name: "Cloudflare",
-			});
-		}
-		return new Response(null, { status: 404 });
-	},
-} satisfies ExportedHandler<Env>;
+    if (url.pathname.startsWith('/api/')) {
+      // write a key-value pair
+      await env.KV.put('KEY', 'VALUE')
+      // read a key-value pair
+      const value = await env.KV.get('KEY')
+      // list all key-value pairs
+      const allKeys = await env.KV.list()
+      // delete a key-value pair
+      await env.KV.delete('KEY')
+
+      return Response.json({
+        name: 'Cloudflare',
+        value,
+        valueAfterDelete: await env.KV.get('KEY'),
+        allKeys,
+      })
+    }
+    return new Response(null, { status: 404 })
+  },
+} satisfies ExportedHandler<Env>
diff --git a/worker-configuration.d.ts b/worker-configuration.d.ts
index fc5ea0c..ff4cbd0 100644
--- a/worker-configuration.d.ts
+++ b/worker-configuration.d.ts
@@ -1,8 +1,9 @@
 /* eslint-disable */
-// Generated by Wrangler by running `wrangler types` (hash: 869ac3b4ce0f52ba3b2e0bc70c49089e)
+// Generated by Wrangler by running `wrangler types` (hash: a5d3a0d06638640f4072385a766cb44d)
 // Runtime types generated with workerd@1.20250902.0 2025-09-09 
 declare namespace Cloudflare {
 	interface Env {
+		KV: KVNamespace;
 	}
 }
 interface Env extends Cloudflare.Env {}
diff --git a/wrangler.jsonc b/wrangler.jsonc
index 5623b2a..651f33c 100644
--- a/wrangler.jsonc
+++ b/wrangler.jsonc
@@ -43,4 +43,15 @@
    * https://developers.cloudflare.com/workers/wrangler/configuration/#service-bindings
    */
   // "services": [{ "binding": "MY_SERVICE", "service": "my-service" }]
+
+  /**
+   * KV Namespaces
+   * https://developers.cloudflare.com/kv/
+   */
+  "kv_namespaces": [
+    {
+      "binding": "KV",
+      "id": "cf60206f0d994aa5ac7d4a4b853ced18",
+    },
+  ],
 }