How I Built a 100ms Real-Time Cross-Device Clipboard (Next.js + Convex)

Dhairya Darji — Thu, 30 Apr 2026 06:08:00 +0000

If you live entirely inside the Apple ecosystem, Universal Clipboard is basically magic. You copy text on your iPhone, and you paste it on your Mac.

But the moment you step outside that walled garden—say, you have an Android phone and a MacBook, or a Windows PC and an iPad—that magic disappears. Suddenly, transferring a 12-digit 2FA code, a block of JSON, or a long URL feels like traveling back to 2005.

The standard workarounds are terrible:

Emailing yourself (and cluttering your inbox).
Using a "Saved Messages" chat on Slack or Telegram (mixing personal chat with transient clipboard data).
Installing heavy background apps like Pushbullet (which often require accounts, logins, and paid subscriptions).

I got tired of this friction. I wanted a zero-login, instant, web-native bridge. So, I built SyncClip.in, a free online clipboard that syncs across devices in under 100 milliseconds.

Here is a breakdown of how I built it, the architecture I chose, and why I opted for "Burn Mode" ephemeral storage over a traditional database.

The Tech Stack

I needed something that could handle real-time state synchronization seamlessly without requiring me to manage WebSockets manually.

Frontend: Next.js 14 (App Router)
Styling: Tailwind CSS (Using a stark, "Editorial Brutalist" design system)
Backend/Database: Convex (Backend-as-a-Service)
Hosting: Vercel

Why Convex for WebSockets?

When building real-time apps, the traditional route is setting up a Node.js server with Socket.io. This works, but managing server state, handling disconnects, and scaling socket connections can become a headache fast.

Convex abstracts all of this away. In Convex, your database is reactive. You write a standard query on the backend, and you use a useQuery hook on the frontend. If the underlying data changes, Convex pushes the update over WebSockets instantly.

For a clipboard tool, this is perfect.

The Architecture: "Burn Mode" vs Permanent Storage

When I first designed the schema, the obvious choice was to create a users table and a clips table. You log in, you see your clips.

But I realized that clipboard data is inherently ephemeral. A 2FA code or a temporary password has a lifespan of about 30 seconds. Forcing a user to create an account to transfer a 30-second string of text is extreme friction. Furthermore, storing users' copied data permanently is a massive privacy liability.

So, I built Burn Mode.

Instead of user accounts, the app uses Temporary Sessions.

When you open the site on your laptop, it generates a random 6-character room code.
You open the site on your phone and enter the code (or scan a QR code).
The two devices are now subscribed to the same Convex document.
When you paste text on the phone, the laptop's UI updates in < 100ms.
The Burn: The moment the session is closed, or after a short expiry window, a Convex CRON job hard-purges the document. It leaves absolutely no trace on the server.

The Code: Syncing State

Here is a simplified look at the Convex mutation that handles the text update. It's incredibly straightforward:

import { mutation } from "./_generated/server";
import { v } from "convex/values";

export const updateClip = mutation({
  args: { sessionId: v.id("sessions"), text: v.string() },
  handler: async (ctx, args) => {
    // Update the session document with the new clipboard text
    await ctx.db.patch(args.sessionId, {
      currentText: args.text,
      lastUpdated: Date.now(),
    });
  },
});

On the Next.js client, subscribing to this data is just one line:

const sessionData = useQuery(api.sessions.get, { sessionId });
// The UI automatically re-renders whenever sessionData.currentText changes

The Result

By treating the browser as the universal operating system, I completely bypassed the need for native apps.

Whether you are on a Linux desktop, a Windows laptop, an iPhone, or an Android, you have a browser. That means you have an instant, secure, real-time bridge.

If you've ever felt the pain of emailing yourself a link just to get it on your computer, give the live app a try. It requires no login and no installation:

👉 Live App: SyncClip — Online Clipboard

Have you ever built anything using Convex? I'd love to hear your thoughts on reactive databases vs traditional REST/Socket setups in the comments!

No-Login Online Clipboard Sync: QR Pairing, Burn Mode, <100ms—Built by a 3rd-Sem CS Student

Dhairya Darji — Wed, 29 Apr 2026 05:38:52 +0000

You've Been Using WhatsApp as Your Clipboard. Here's the Fix I Built.

Copy code on your laptop. Need it on phone? WhatsApp "Saved Messages" becomes your clipboard.

I did this for months as a 3rd-semester Computer Engineering student in Ahmedabad. Emailing myself API keys. Screenshotting terminal commands. Flow completely broken.

Then I shipped SyncClip: The "online clipboard" that works across any devices—instantly, privately, no login required.

The Problem: Every Developer's Dirty Secret

Code Snippets: Copy from IDE → test on mobile → "send to self" via messaging.
Links & Notes: Mobile browsing → need on laptop → email chain.
API Keys/OTPs: WhatsApp them → pray no one sees chat history.
Time Lost: 2-5 minutes per switch. x10 daily = hours wasted.

Existing "clipboard sync" tools? Apps to install. Accounts to create. Data logged forever. Not good enough.

SyncClip: Online Clipboard Sync Done Right

Live: https://syncclip.in

🎯 Zero Friction Setup

Open syncclip.in on both devices
Generate 6-char room code (or QR scan)
Copy/paste instantly

No apps. No passwords. Browser-only.

🔒 Privacy-First Architecture

Burn After Reading: Paste sensitive data → other device reads → auto-deletes.
Volatile Sessions: Everything expires in 24 hours.
No Tracking: We don't want your email or data.

⚡ Power User Features

Real-Time Sync: WebSockets push updates in <100ms.
Smart Formatting: Auto-detects code blocks, JSON, URLs.
Keyboard-First: CMD+K palette for everything.

How I Built It (Tech Stack)

Frontend: Next.js 15 (App Router, Server Actions)

Backend: Convex (reactive database + authless rooms)

Deploy: Vercel (edge functions for global speed)

// Core sync (Convex subscription)
useSubscription({
  query: () => q("clips").collect(),
  onData: (clips) => {
    // Push latest clip to all devices
  }
});

Buying syncclip.in was the moment it felt real. DNS setup, SSL config, first deploy—pure adrenaline.

Why SyncClip Beats Alternatives

Tool	Apps Needed	Login	Privacy	Cross-Device Speed	Free
SyncClip	❌ None	❌ None	Burn Mode	<100ms	✅ Forever
Pushbullet	✅ Yes	✅ Yes	Stored	~1s	❌ Freemium
GoOnlineTools	❌ Browser	❌ None	Basic	~500ms	✅ Yes
Clipboard-QR	✅ App	❌ None	None	Manual	✅ Yes

SyncClip wins on instant setup + developer privacy.

Who Loves It Already

"Fixed my phone→laptop debug flow. Burn mode = genius." — Indie Hacker on Discord

"No more WhatsApp clipboard hacks. QR pairing is smooth." — r/SideProject dev

Strangers using it daily. That's the surreal part.

Try Online Clipboard Sync Today

India devs: Ditch WhatsApp workflow. Global teams: Privacy without setup tax.

🔗 https://syncclip.in (QR scan works anywhere)

BuiltfromAhmedabad, India. Questions? Feedback? Drop below.

buildinpublic #webdev #productivity #javascript #nextjs

Forem: Dhairya Darji