Clipit

Share clipboard content between devices instantly - no app, no account, just open a URL and scan a QR code.

How it works

1. Open the app on one device - a unique session is created
2. Your clipboard shows as a QR code
3. Scan it on another device to join the same session
4. Both devices stay in sync in real time via WebSocket

Built on Cloudflare Workers and Durable Objects - runs at the edge globally with zero cold starts.

Quick Start (local development)

You need Node.js 18+ and two terminal windows.

Terminal 1 - Backend Worker:

cd worker
npm install
npm run dev
# Worker running at http://localhost:8787

Terminal 2 - Frontend:

cd frontend
npm install
npm run dev
# App running at http://localhost:5173

Open http://localhost:5173 in your browser. The frontend talks to the worker at localhost:8787 automatically in dev mode.

Project Structure

clipit/
├── frontend/          # Vite + vanilla JS SPA
│   ├── src/
│   │   ├── main.js    # App entry point
│   │   └── style.css  # Global styles
│   ├── public/        # Static assets
│   └── README.md      # Frontend docs
├── worker/            # Cloudflare Worker + Durable Objects
│   ├── src/
│   │   └── index.js   # Worker fetch handler and DO class
│   ├── wrangler.jsonc # Worker configuration
│   └── README.md      # Worker / protocol docs
└── CLAUDE.md          # AI assistant instructions

Deployment

Prerequisites

• Cloudflare account (free tier works)
• wrangler authenticated: npx wrangler login

Deploy the Worker

cd worker
npm install
npm run deploy

Wrangler will output the Worker URL (e.g. https://worker.<your-subdomain>.workers.dev).

Deploy the Frontend

Build the frontend and deploy to any static host (Cloudflare Pages, Netlify, Vercel, etc.):

cd frontend
npm run build
# Output is in frontend/dist/

Option A - Cloudflare Pages (recommended, same network as Worker):

npx wrangler pages deploy dist --project-name clipit-frontend

Option B - Any static host: Upload the dist/ folder. Set the VITE_WORKER_URL environment variable to your deployed Worker URL before building:

VITE_WORKER_URL=https://worker.your-subdomain.workers.dev npm run build

Cost Breakdown

Clipit runs entirely on Cloudflare's free tier for typical personal use.

Resource	Free Tier Limit	Clipit Usage
Workers requests	100,000 / day	One per session join
Durable Objects compute	400,000 GB-s / month	~1 ms per message
Durable Objects storage	1 GB	~1 KB per session
Durable Objects WebSocket	Included	One per connected device
Workers KV	Not used	-

Estimated cost for personal use: $0/month on the free tier.

At scale (paid Workers plan, $5/month):

• DO requests: $0.15 per million
• DO duration: $12.50 per million GB-s
• Storage: $0.20 per GB-month

For a clipboard app with short-lived sessions and small payloads, compute cost is negligible even at thousands of daily users.

Tech Stack

Layer	Technology
Frontend	Vite, vanilla JavaScript
QR Codes	qrcode npm package
Backend	Cloudflare Workers
State & sync	Cloudflare Durable Objects (SQLite)
Real-time	WebSockets via Durable Objects
Deployment	wrangler CLI

Documentation

• Frontend README - Architecture, folder structure, env config
• Worker README - Durable Objects, signaling protocol, configuration