Switch from NextJS -> Vite for supabase-todolist demo.

Author: rkistner

demos/example-vite/vite.config.ts

@@ -12,6 +12,7 @@ export default defineConfig({
       input: 'src/index.html'
     }
   },
+  envDir: '..', // Use this dir for env vars, not 'src'.
   optimizeDeps: {
     // Don't optimize these packages as they contain web workers and WASM files.
     // https://github.com/vitejs/vite/issues/11672#issuecomment-1415820673

demos/nextjs-supabase-todolist/.eslintrc.json

@@ -1,4 +1,4 @@
-# PowerSync + Supabase Next.js Demo: Todo List
+# PowerSync + Supabase Web Demo: Todo List
 
 ## Note: Beta Release
 
@@ -10,8 +10,6 @@ Demo app demonstrating use of the [PowerSync SDK for Web](https://www.npmjs.com/
 
 A step-by-step guide on Supabase<>PowerSync integration is available [here](https://docs.powersync.com/integration-guides/supabase).
 
-This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app).
-
 ## Getting Started
 
 In your terminal, switch into the demo's directory:
@@ -56,19 +54,6 @@ Open a browser on the served URL and install the PWA.
 
 ## Learn More
 
-To learn more about Next.js, take a look at the following resources:
-
-- [Next.js documentation](https://nextjs.org/docs) - learn about Next.js features and API.
-- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.
-
-You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome!
-
-Also check out [the PowerSync Web SDK on GitHub](https://github.com/powersync-ja/powersync-js/tree/main/packages/powersync-sdk-web) - your feedback and contributions are welcome!
+Check out [the PowerSync Web SDK on GitHub](https://github.com/powersync-ja/powersync-js/tree/main/packages/powersync-sdk-web) - your feedback and contributions are welcome!
 
 To learn more about PowerSync, see the [PowerSync docs](https://docs.powersync.com).
-
-## Deploy on Vercel
-
-The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js.
-
-Check out the [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details.

demos/nextjs-supabase-todolist/README.md

@@ -3,14 +3,12 @@
   "version": "0.1.10",
   "private": true,
   "scripts": {
-    "build": "next build",
-    "clean": "rm -rf .next",
-    "watch": "next dev",
-    "start": "next start",
-    "lint": "next lint"
+    "dev": "vite",
+    "build": "tsc -b && vite build",
+    "preview": "vite preview",
+    "start": "pnpm build && pnpm preview"
   },
   "dependencies": {
-    "@ducanh2912/next-pwa": "9.7.2",
     "@emotion/react": "^11.11.3",
     "@emotion/styled": "^11.11.0",
     "@fontsource/roboto": "^5.0.8",
@@ -26,19 +24,20 @@
     "lodash": "^4.17.21",
     "next": "14.1.0",
     "react": "^18",
-    "react-dom": "^18"
+    "react-dom": "^18",
+    "react-router-dom": "^6.22.1"
   },
   "devDependencies": {
     "@types/lodash": "^4.14.202",
     "@types/node": "^20.11.16",
     "@types/react": "^18.2.55",
     "@types/react-dom": "^18.2.19",
+    "@vitejs/plugin-react": "^4.2.1",
     "autoprefixer": "^10.4.17",
     "babel-loader": "^9.1.3",
-    "eslint": "^8",
-    "eslint-config-next": "14.0.0",
-    "postcss": "^8.4.35",
-    "tailwindcss": "^3.4.1",
-    "typescript": "^5"
+    "typescript": "^5",
+    "vite": "^5.1.4",
+    "vite-plugin-top-level-await": "^1.4.1",
+    "vite-plugin-wasm": "^3.3.0"
   }
 }