Spaces:
Sleeping
Sleeping
| # Server Mode - Self-Hosting Guide | |
| Self-host OSW Studio with persistence, authentication, and static site publishing. | |
| --- | |
| ## Overview | |
| OSW Studio supports two deployment modes: | |
| - **Browser Mode** (default): Pure client-side application using IndexedDB | |
| - **Server Mode**: Full-stack deployment with publishing | |
| Server Mode adds: | |
| - Local database for persistent storage (no external database needed) | |
| - Admin authentication with JWT sessions | |
| - Deployment publishing system with static site serving | |
| - Project sync between browser and server | |
| - Built-in analytics and compliance features | |
| --- | |
| ## Browser Mode vs Server Mode | |
| ### Browser Mode (Default) | |
| **Characteristics:** | |
| - No backend required | |
| - Deploy to any static host (Vercel, Netlify, GitHub Pages, HuggingFace) | |
| - Zero configuration | |
| - Complete privacy (data never leaves browser) | |
| - No multi-user support | |
| - No server-side persistence | |
| - No static site publishing | |
| **Use Cases:** | |
| - Personal development environment | |
| - Quick prototyping | |
| - Privacy-focused workflows | |
| - Static deployment (HuggingFace Spaces) | |
| ### Server Mode | |
| **Characteristics:** | |
| - Local persistence (no external database) | |
| - Admin authentication | |
| - Multiple deployments per project | |
| - Static site publishing at `/deployments/{id}/` | |
| - Built-in analytics | |
| - Project sync (browser <-> server) | |
| - Requires persistent file system | |
| - Requires server hosting | |
| **Use Cases:** | |
| - Production deployments | |
| - Multi-user environments (see **[Multitenancy](?doc=multitenancy)**) | |
| - Publishing static sites | |
| - Persistent project storage | |
| --- | |
| ## Quick Start | |
| ### 1. Configure Environment | |
| Create `.env` file in project root: | |
| ```bash | |
| # Enable Server Mode | |
| NEXT_PUBLIC_SERVER_MODE=true | |
| # Session security (generate with: openssl rand -base64 32) | |
| SESSION_SECRET=your_random_secret_here | |
| # Admin password (optional — only needed for headless/scripted bootstrap) | |
| # For interactive setup, skip this and create admin via /admin/register on first visit | |
| # ADMIN_PASSWORD=your_secure_password_here | |
| # Optional: Analytics secret | |
| ANALYTICS_SECRET=your_analytics_secret_here | |
| # Optional: Secrets encryption (generate with: node -e "console.log(require('crypto').randomBytes(32).toString('base64'))") | |
| SECRETS_ENCRYPTION_KEY=your_encryption_key_here | |
| # Optional: App URL (for SEO/sitemaps) | |
| NEXT_PUBLIC_APP_URL=https://your-domain.com | |
| ``` | |
| ### 2. Start Server | |
| ```bash | |
| npm install | |
| npm run dev | |
| ``` | |
| SQLite databases are created automatically: | |
| - `data/osws.sqlite` - Core database (projects, deployments, templates, skills) | |
| - `deployments/{id}/runtime.sqlite` - Per-deployment runtime (edge functions, secrets, user tables) | |
| - `deployments/{id}/analytics.sqlite` - Per-deployment analytics (pageviews, sessions) | |
| ### 3. Access Application | |
| - **Studio**: http://localhost:3000/ | |
| - **Admin panel**: http://localhost:3000/admin/login | |
| - **Published sites**: http://localhost:3000/deployments/{id}/ | |
| **On first visit**, you'll be prompted to create an admin account. After login, you'll land on the **Dashboard** with server stats and traffic metrics. | |
| --- | |
| ## Server Context Integration | |
| In Server Mode, the AI gains awareness of your deployment's backend features through a special `/.server/` folder that appears in the file explorer. | |
| ### How It Works | |
| When you select a deployment from the **Deployment Selector** dropdown (in the workspace header), OSW Studio: | |
| 1. Loads that deployment's backend features (edge functions, database schema, server functions, secrets) | |
| 2. Mounts them as transient files in `/.server/` | |
| 3. Informs the AI about these capabilities in its system prompt | |
| ### The `/.server/` Folder | |
| This hidden folder contains: | |
| - **db/schema.sql** - Database schema (read-only, use `sqlite3` for DDL) | |
| - **edge-functions/*.json** - Edge functions (editable via shell commands) | |
| - **server-functions/*.json** - Server functions (editable via shell commands) | |
| - **secrets/*.json** - Secret placeholders (editable - AI creates, user sets values in admin UI) | |
| These files are: | |
| - **Transient** - They are not saved with the project | |
| - **Auto-updated** - They reflect the current deployment's state | |
| - **Partially editable** - Schema is read-only, but functions and secrets can be modified | |
| ### Using Backend Features with AI | |
| Once a deployment is selected, you can ask the AI to: | |
| ``` | |
| What edge functions are available for this deployment? | |
| ``` | |
| ``` | |
| Help me create an edge function that uses the products table | |
| ``` | |
| ``` | |
| Show me the database schema | |
| ``` | |
| The AI will use the `/.server/` files to understand your deployment's capabilities and provide relevant assistance. | |
| ### Viewing the `/.server/` Folder | |
| The folder is hidden by default. To view it: | |
| 1. Right-click in the File Explorer | |
| 2. Select **Show Hidden Files** | |
| 3. The `/.server/` folder appears with an orange server icon | |
| --- | |
| ## Project Sync | |
| Server Mode uses a hybrid storage approach: projects are edited locally in the browser (for speed) and synced to the server (for persistence). This gives you the best of both worlds - fast local editing with server-side backup. | |
| ### How Sync Works | |
| **Automatic Push (on save):** | |
| When you save a project in Server Mode, it automatically syncs to the server. You'll see a brief "Project synced" notification. | |
| **Automatic Pull (on load):** | |
| When you open the Project Manager, OSW Studio checks for any updates from the server and pulls them automatically. Projects that exist on the server but not locally are downloaded. | |
| **Manual Sync:** | |
| For bulk operations or troubleshooting, use the Sync button in the sidebar. This opens a dialog where you can: | |
| - **Push to Server** - Upload all local projects to the database | |
| - **Pull from Server** - Download all server projects to your browser | |
| ### When to Use Manual Sync | |
| - **Setting up a new browser** - Pull to populate your IndexedDB from the server | |
| - **After server restore** - Pull to get the restored data locally | |
| - **Troubleshooting** - Force push/pull if auto-sync isn't working | |
| --- | |
| ## Deployment Options | |
| > **Important**: Server Mode requires **persistent file system** storage because published sites are written to `/public/deployments/` and databases are stored locally. Serverless platforms like Vercel, Netlify, and Cloudflare Workers **will not work** for Server Mode. | |
| ### Option 1: Desktop App (Easiest) | |
| **Why**: Zero setup — download, install, run. The desktop app bundles the full server with SQLite, so you get publishing and sync without running a server. | |
| **Pricing**: Free | |
| **Steps:** | |
| 1. Download the installer for your platform from [GitHub Releases](https://github.com/o-stahl/osw-studio/releases) | |
| 2. Install and launch — authentication is bypassed for the single local user | |
| 3. Published sites are served locally at `http://localhost:3000/deployments/{id}/` | |
| **Best for**: Personal use, local development, and evaluating Server Mode features without provisioning a server. | |
| --- | |
| ### Option 2: Railway (Recommended for Hosting) | |
| **Why**: Simple setup, persistent storage, usage-based pricing | |
| **Pricing**: $5/month minimum (includes $5 in usage credits). Free trial: 30 days with $5 credits. | |
| **Steps:** | |
| 1. **Create Railway Account:** | |
| - Go to https://railway.app | |
| - Sign up with GitHub | |
| 2. **New Project:** | |
| - Click "New Project" | |
| - Select "Deploy from GitHub repo" | |
| - Choose your OSW Studio fork | |
| 3. **Configure Variables:** | |
| - Go to project variables | |
| - Add: | |
| ``` | |
| NEXT_PUBLIC_SERVER_MODE=true | |
| SESSION_SECRET=<generate> | |
| NEXT_PUBLIC_APP_URL=${{ RAILWAY_PUBLIC_DOMAIN }} | |
| ``` | |
| 4. **Deploy:** | |
| - Railway auto-deploys on push | |
| - Access at: `https://your-project.up.railway.app` | |
| --- | |
| ### Option 3: VPS (Full Control) | |
| **Why**: Complete control, custom domains, lowest cost at scale | |
| **Requirements:** | |
| - Ubuntu 22.04+ server (Hetzner, DigitalOcean, Linode, etc.) | |
| - SSH access | |
| - Domain (optional, but recommended for SSL) | |
| **Quick Overview:** | |
| 1. Create server with SSH key and firewall (ports 22, 80, 443 only) | |
| 2. Create non-root user, harden SSH, install fail2ban | |
| 3. Install Node.js via nvm, clone repo, configure environment | |
| 4. Build app and run with PM2 | |
| 5. Setup Nginx reverse proxy | |
| 6. Add SSL with certbot | |
| **See the full guide:** **[VPS Deployment Guide](?doc=vps-deployment)** — includes security hardening, swap setup, PM2 auto-start, and detailed step-by-step instructions. | |
| --- | |
| ## Environment Variables | |
| | Variable | Required | Description | | |
| |----------|----------|-------------| | |
| | `NEXT_PUBLIC_SERVER_MODE` | Yes | Set to `true` to enable Server Mode | | |
| | `SESSION_SECRET` | Yes | Random string for JWT signing | | |
| | `ADMIN_PASSWORD` | No | Bootstrap only. Used for initial setup when no user accounts exist. Once the first account is created via `/admin/register`, this is ignored. New installs can skip this entirely. | | |
| | `ANALYTICS_SECRET` | No | Secret for analytics API | | |
| | `SECRETS_ENCRYPTION_KEY` | No | 256-bit key for encrypting secrets | | |
| | `SECURE_COOKIES` | No | Set to `false` to allow insecure cookies (pre-SSL only) | | |
| | `NEXT_PUBLIC_APP_URL` | No | Base URL for SEO/sitemaps | | |
| | `REGISTRATION_MODE` | No | `open` to allow user self-registration, `closed` (default) for admin-only provisioning | | |
| | `NEXT_PUBLIC_REGISTRATION_MODE` | No | Client-side mirror of `REGISTRATION_MODE` | | |
| | `INSTANCE_API_KEY` | No | Shared secret for machine-to-machine admin API auth | | |
| | `INSTANCE_ID` | No | Instance identifier for multi-instance setups | | |
| For multitenancy details, see **[Multitenancy](?doc=multitenancy)**. | |
| --- | |
| ## Troubleshooting | |
| ### Database Issues | |
| **Symptoms**: "Failed to initialize database" | |
| **Solutions**: | |
| 1. Check write permissions on `data/` directory | |
| 2. Ensure disk space is available | |
| 3. Check file system supports SQLite (most do) | |
| 4. Try deleting `data/osws.sqlite` and restarting (loses data) | |
| ### Migration Failures | |
| **Symptoms**: Tables not created, "relation does not exist" | |
| **Solutions**: | |
| 1. Migrations run automatically on first request | |
| 2. Check terminal logs for errors | |
| 3. Restart the server to trigger migrations | |
| ### Authentication Issues | |
| **Symptoms**: Can't login to /admin | |
| **Solutions**: | |
| 1. If no users exist yet, visit `/admin` to create the admin account | |
| 2. Clear browser cookies and try again | |
| 3. Try incognito mode | |
| 4. Check `SESSION_SECRET` is set in .env | |
| 5. If you've forgotten your password, delete `data/system.sqlite` and restart to re-create the admin account (workspace data is preserved) | |
| ### Performance Issues | |
| **Symptoms**: Slow site loads, high memory | |
| **Solutions**: | |
| 1. Optimize published sites: | |
| - Compress images | |
| - Minify CSS/JS | |
| - Use CDN for libraries | |
| 2. Monitor server resources: | |
| ```bash | |
| htop # or top | |
| df -h # disk space | |
| free -m # memory | |
| ``` | |
| 3. Scale server resources (RAM/CPU) | |
| 4. Add caching (Nginx cache) | |
| --- | |
| ## Next Steps | |
| - **[Deployment Publishing](?doc=site-publishing)** - Publish deployments with analytics, SEO, compliance | |
| - **[Backend](?doc=backend-features)** - Database, edge functions, secrets | |
| - **[FAQ](?doc=faq)** - Common Server Mode questions | |
| - **[Troubleshooting](?doc=troubleshooting)** - Fix common issues | |