# Sync — Developer Setup Guide
**AI Website Builder by Demure Platform Inc.**
Last updated: June 2026

---

## Overview

Sync is a full-stack AI-powered website builder. This document contains everything a developer needs to stand the project back up on a new host, migrate the database, or hand it off.

---

## Stack

| Layer | Technology |
|---|---|
| Frontend | React 19 + Vite 7 + Tailwind CSS v4 + shadcn/ui |
| Backend | Express 5 (Node 24, ESM, esbuild bundle) |
| Database | PostgreSQL 15+ with Drizzle ORM |
| AI Inference | Anthropic Claude (claude-opus-4-8 for code, claude-sonnet-4-6 for text) |
| Auth | Clerk (Replit-managed tenant in prod, dev keys in dev) |
| Payments | Stripe (via `stripe-replit-sync` connector) |
| Email | Resend (transactional + email capture) |
| Analytics | Google Analytics 4 |
| Error tracking | Sentry (frontend, optional) |
| Monorepo | pnpm workspaces |

---

## Project Structure

```
/
├── artifacts/
│   ├── platform/          ← React/Vite frontend (main app)
│   └── api-server/        ← Express API server
├── lib/
│   ├── db/                ← Drizzle ORM schema + migrations
│   ├── api-spec/          ← OpenAPI spec (source of truth for API)
│   ├── api-client-react/  ← Generated React Query hooks
│   └── api-zod/           ← Generated Zod schemas
├── .env.template          ← Copy to .env and fill in values
├── DEVELOPER_SETUP.md     ← This file
└── pnpm-workspace.yaml    ← Workspace package catalog
```

---

## Quick Start (local / new host)

```bash
# 1. Install pnpm if needed
npm install -g pnpm

# 2. Install all workspace dependencies
pnpm install

# 3. Copy the env template and fill in values
cp .env.template .env
# → Edit .env with your values (see "Environment Variables" below)

# 4. Push the database schema
pnpm --filter @workspace/db run push

# 5. Start the API server (port 8080)
pnpm --filter @workspace/api-server run dev

# 6. Start the frontend (separate terminal)
pnpm --filter @workspace/platform run dev
```

---

## Environment Variables — Complete Reference

Copy `.env.template` to `.env` and fill in these values.

### SERVER

| Variable | Value | Notes |
|---|---|---|
| `PORT` | `8080` | API server port |
| `SESSION_SECRET` | *(random 64-char string)* | Generate with: `openssl rand -hex 32` |

### DATABASE

| Variable | Notes |
|---|---|
| `DATABASE_URL` | Full PostgreSQL connection URI |
| `PGHOST` | Database host |
| `PGPORT` | `5432` |
| `PGDATABASE` | Database name |
| `PGUSER` | Database user |
| `PGPASSWORD` | Database password |

> **Recommended providers when self-hosting:** Neon (serverless Postgres, free tier), Supabase, Railway, or PlanetScale (MySQL — requires schema changes).
>
> **Migrating from Replit:** See "Database Migration" section below.

### AI — Anthropic

| Variable | Value | Notes |
|---|---|---|
| `AI_INTEGRATIONS_ANTHROPIC_BASE_URL` | `https://api.anthropic.com` | Use Replit proxy URL on Replit |
| `AI_INTEGRATIONS_ANTHROPIC_API_KEY` | `sk-ant-...` | Get from console.anthropic.com |

Models used:
- **Code / Vision / Build:** `claude-opus-4-8`
- **Text / Chat / Others:** `claude-sonnet-4-6`

### AUTH — Clerk

| Variable | Notes |
|---|---|
| `CLERK_PUBLISHABLE_KEY` | From Clerk dashboard → API Keys |
| `CLERK_SECRET_KEY` | From Clerk dashboard → API Keys (keep secret) |
| `VITE_CLERK_PUBLISHABLE_KEY` | Same as `CLERK_PUBLISHABLE_KEY` |
| `VITE_CLERK_PROXY_URL` | Leave blank in dev; auto-set by Replit in prod |

> **On Replit:** Clerk is provisioned automatically via the Auth pane. Keys are injected into the environment — no manual setup needed.
>
> **Self-hosting:** Create a Clerk app at https://clerk.com. Enable Google OAuth under "Social connections". Set `signInUrl` / `signUpUrl` to match your domain.

### PAYMENTS — Stripe

| Variable | Notes |
|---|---|
| `STRIPE_SECRET_KEY` | Stripe Dashboard → Developers → API Keys |
| `STRIPE_PUBLISHABLE_KEY` | Same location, publishable key |
| `STRIPE_WEBHOOK_SECRET` | Created automatically by `stripe-replit-sync`; or set manually via Stripe CLI |

> **On Replit:** Managed via the Stripe integration connector. The `stripe-replit-sync` package handles webhook registration automatically on startup.

### EMAIL — Resend

| Variable | Value |
|---|---|
| `RESEND_API_KEY` | Stored in Replit Secrets — export before moving (re_...) |

**Sending domain:** `sync.demuregram.com`
Add Resend DNS records for this domain at https://resend.com/domains.

Endpoint: `POST /api/email/subscribe` — sends a branded welcome email to new subscribers.

### ANALYTICS — Google Analytics 4

| Variable | Value |
|---|---|
| `VITE_GA_MEASUREMENT_ID` | **`G-XG07S7LHYV`** |

This is a public value — safe to commit. Analytics streams to the GA4 property for this Measurement ID.

### ERROR TRACKING — Sentry (optional)

| Variable | Notes |
|---|---|
| `VITE_SENTRY_DSN` | Leave blank to disable. From sentry.io → Project → Client Keys |

---

## Database Migration (moving off Replit)

When leaving Replit, export the database before the environment is torn down:

```bash
# 1. Export from Replit's managed Postgres
pg_dump "$DATABASE_URL" --no-owner --no-acl -Fc -f sync_backup.dump

# 2. On the new host, create a fresh database and restore
createdb sync_production
pg_restore -d sync_production --no-owner sync_backup.dump

# 3. Update DATABASE_URL in your new environment to point to the new DB
# 4. Run migrations to ensure schema is current
pnpm --filter @workspace/db run push
```

> **Tables in the app database:**
> - `conversations` — AI chat sessions
> - `messages` — individual chat messages
> - `projects` — user projects
> - `workspaces` — per-conversation code workspaces
>
> **Stripe schema** lives in a separate `stripe` Postgres schema (managed by `stripe-replit-sync`).

---

## Deployment Checklist (non-Replit)

- [ ] PostgreSQL 15+ provisioned and `DATABASE_URL` set
- [ ] All env vars from `.env.template` filled in
- [ ] `pnpm --filter @workspace/db run push` run against new DB
- [ ] Clerk app created, domain allow-listed in Clerk dashboard
- [ ] Stripe webhook URL updated to new domain
- [ ] Resend domain DNS verified for `sync.demuregram.com`
- [ ] `VITE_GA_MEASUREMENT_ID=G-XG07S7LHYV` set (or update to new GA property)
- [ ] Build: `pnpm --filter @workspace/api-server run build` + `pnpm --filter @workspace/platform run build`
- [ ] API server started on `PORT=8080` (or your chosen port)
- [ ] Frontend static build served (e.g. via nginx, Vercel, Netlify)

---

## Running Commands

```bash
# Full typecheck (all packages)
pnpm run typecheck

# Regenerate API hooks from OpenAPI spec
pnpm --filter @workspace/api-spec run codegen

# Push DB schema changes (dev only — use migrations in prod)
pnpm --filter @workspace/db run push

# Build API server
pnpm --filter @workspace/api-server run build

# Build frontend
pnpm --filter @workspace/platform run build
```

---

## Support

- **App name:** Sync
- **Company:** Demure Platform Inc.
- **Copyright:** © 2026 Demure Platform Inc.
- **Contact emails:** security@sync.demuregram.com · privacy@sync.demuregram.com