DEV Community

Cover image for I Built "AirDrop for Text" with Node.js, Socket.IO and a QR Code — No Cloud, No Accounts
Aashu Bhat
Aashu Bhat

Posted on

I Built "AirDrop for Text" with Node.js, Socket.IO and a QR Code — No Cloud, No Accounts

#javascript #webdev #showdev #node

I kept emailing myself code snippets and URLs just to move them from my phone to my PC. Cloud notes apps felt like overkill — and I hated that every keystroke went through someone else's server.

So I built AirTextPad: a live scratchpad that syncs across all devices on your local Wi-Fi. Scan a QR code, start typing on your phone, watch it appear on your PC. Zero internet, zero accounts, zero cloud.

How it works

The whole trick is three pieces:

  1. Express serves a tiny web app on your LAN (0.0.0.0:3000)
  2. Socket.IO syncs every keystroke in real time
  3. QRCode generates a connect link so phones join without typing IPs

The phone needs no app — it just opens a browser (it's even a PWA, so you can install it).

The server: 40 lines that matter 

const io = new Server(server);

io.on('connection', async (socket) => {
  const url = `http://${localIP}:${PORT}`;
  const qrImage = await QRCode.toDataURL(url);
  socket.emit('init-data', { currentText, notes, localIP, port: PORT, qrCode: qrImage });

  socket.on('update-live', (t) => {
    currentText = t;
    socket.broadcast.emit('sync-live', t); // every other device updates
  });
});

server.listen(3000, '0.0.0.0');
Enter fullscreen mode Exit fullscreen mode

The LAN IP is detected with os.networkInterfaces() — no config, no env vars.

The client: two lines of sync 

scratchpad.addEventListener('input', () =>
  socket.emit('update-live', scratchpad.value));

socket.on('sync-live', t => scratchpad.value = t);
Enter fullscreen mode Exit fullscreen mode

That's the entire "AirDrop" feeling. Everything else is UI: a snippet library with live Markdown preview (via marked), search, and one-tap copy.

Desktop shell: Electron as a thin wrapper 

require('./server.js');            // boot the Node server
win.loadURL('http://localhost:3000');
Enter fullscreen mode Exit fullscreen mode

Electron just hosts the web app — electron-builder turns it into a Windows installer.

Why local-only matters

  • 🔒 Notes live in a JSON file on your machine
  • ✈️ Works with the internet unplugged
  • ⚡ Latency is your router, not a data center

⚠️ Honest caveat: the server binds to 0.0.0.0, so it's meant for trusted home/office Wi-Fi — not a café network.

Try it

It's open source (MIT). I'd love brutal feedback on the Socket.IO setup and how you'd harden the local-network security model. Drop a comment or open an issue!

electron #nodejs #opensource #webdev

Top comments (0)