New Project: CodeShare!

My Latest Project CodeShare. Real-Time Pair Programming in the Browser! 🚀

In the first couple of weeks at TechNative Digital, we needed the ability to quickly view, share, and edit code in real-time.

There are loads of tools for this, but many were overkill, paid, or came with setup friction, especially for people still getting comfortable in VS Code. A lot of us ended up sending snippets back and forth in Slack (me included).

Ideally, I wanted something free, real-time, link-based and private, with no sign-up. When I couldn’t find exactly that, I thought I’d have a go at building it myself.

Three days later, I finished making CodeShare. It's a browser-based collaborative coding tool with a shared code editor, whiteboard, and chat. No account or installation required - just create a session and share the link!

I had great fun making this, but hit a few bumps along the way…

For example, I initially managed to get the peer-to-peer connection working really well (well, it worked on my machine, anyway 😅). I excitedly messaged my boyfriend with the link, typed 'Hello? Hello?' into the editor, and… nothing happened. I could see that he had joined the room, but we couldn’t establish a usable connection.

This took me down a rabbit hole of STUN and TURN servers.

Most networks will happily do peer-to-peer connections, but others will refuse incoming connections entirely. So, you need a relay fallback (TURN) for reliability.

Another issue was the late joiner problem. If a user joined after code was written or drawings were made, they’d only see changes from that point onwards. This was tricky!

The solution was to make sure new peers receive the current shared state and complete the sync handshake properly. I used [Yjs](https://yjs.dev/) that makes sure the initial document state is exchanged when a new user joins the session.

The biggest headache by far was implementing a fill tool and brush-based eraser in the whiteboard, which might deserve its own post 😆

The app is stateless by design and it doesn’t store your code, chat, or whiteboard doodles. When connected, the data flows directly between browsers.

It's also intentionally simple and really more of a shared workspace, although I’d like to explore multi-file support and a lightweight terminal experience down the line.

If you try it and find bugs, please let me know - real users are the best test suite 😅.

Live: https://codeshare.uk/

Source code: https://github.com/alexmc2/code-share

Tech Stack:

- Vite + React + TypeScript

- Monaco Editor

- Yjs (CRDT-based collaboration)

- WebRTC (peer-to-peer data channels)

- An Express + socket.io signalling server (signalling only, no content stored)

- Deployed with the backend on DigitalOcean and the frontend on Cloudflare