Allow dev server to run without SSL certs

README.md

@@ -112,6 +112,10 @@ Update the values in the `.env` file. The following variables are needed:
 yarn dev
 ```
 
+The server will run over HTTP by default. If you place `cert.pem` and
+`key.pem` in a `.certs` directory at the project root (see the HTTPS section
+below), it will automatically use those files and start with HTTPS.
+
 ## Usage
 
 1. Select a time frame to analyze
@@ -177,7 +181,7 @@ Once your Tailscale network is set up, all that's required in the app is that yo
 
 ### iOS Home Screen Icons (and HTTPS Gotchas)
 
-To make your WellSaid app look great when saved to your iPhone's Home Screen, iOS requires a **valid HTTPS certificate**:
+To make your WellSaid app look great when saved to your iPhone's Home Screen, iOS requires a **valid HTTPS certificate**. This step is optional—if you just want to run the app locally in a browser, you can skip it and use plain HTTP.
 
 1. **Install mkcert (if not already installed)**
 
@@ -193,6 +197,8 @@ mkcert <your-tailscale-hostname>.<tailscale-subdomain>.ts.net localhost
 ```
 
 This will create a cert/key pair like `rootCA.pem` and `rootCA-key.pem`.
+Move the generated certificate files into a `.certs` directory at the project
+root so the development server can automatically find them.
 
 3. **Trust the cert on your iPhone**
 

vite.config.ts

@@ -13,14 +13,24 @@ export default defineConfig({
         port: 5173, // Default Vite port, change if needed
         strictPort: true, // Fail if port is already in use
         // HTTPS configuration
-        // Ensure you have created cert.pem and key.pem in a .certs directory in your project root
-        // using mkcert for your Tailscale domain and localhost.
-        // e.g., mkcert your-domain.ts.net localhost
-        // then: mkdir .certs; mv your-domain.ts.net+1.pem .certs/cert.pem; mv your-domain.ts.net+1-key.pem .certs/key.pem
-        https: {
-            key: fs.readFileSync(path.resolve(__dirname, '.certs/key.pem')),
-            cert: fs.readFileSync(path.resolve(__dirname, '.certs/cert.pem')),
-        },
+        // If cert.pem and key.pem exist in a .certs directory, use them
+        // for HTTPS. Otherwise fall back to HTTP.
+        // You can create the certs with mkcert for your Tailscale domain
+        // and localhost:
+        //   mkcert your-domain.ts.net localhost
+        //   mkdir .certs; mv your-domain.ts.net+1.pem .certs/cert.pem
+        //   mv your-domain.ts.net+1-key.pem .certs/key.pem
+        https: (() => {
+            const keyPath = path.resolve(__dirname, '.certs/key.pem')
+            const certPath = path.resolve(__dirname, '.certs/cert.pem')
+            if (fs.existsSync(keyPath) && fs.existsSync(certPath)) {
+                return {
+                    key: fs.readFileSync(keyPath),
+                    cert: fs.readFileSync(certPath),
+                }
+            }
+            return undefined
+        })(),
         allowedHosts: [process.env.ALLOWED_HOST || 'all'],
     },
 })