// the find
xun082/online-edit-web
✍️✍️✍️ An online code editor based on Next.js and NestJS, using Monaco Editor and Yjs for real-time collaborative editing and synchronization.
A browser-based code editor built on Monaco Editor and WebContainers, with real-time collaborative editing via Yjs/WebSocket. Targets developers who want a CodeSandbox-like experience they can self-host. The collaboration piece is the main differentiator — you can share a room link and co-edit with cursor presence.
WebContainer integration is the real technical bet here — running npm install and pnpm dev in the browser without a backend VM is genuinely impressive and means the preview is local to the user's browser. Yjs with y-monaco is a solid CRDT choice for collaborative editing; it handles conflict resolution correctly rather than bolting on a naive last-write-wins. The store separation (editorStore, fileSearchStore, webContainerStore, etc.) with Zustand is clean — state is scoped to concerns rather than dumped into one global blob. Storybook setup with component stories for the UI primitives suggests the UI components are meant to be developed in isolation, which is useful for a project with multiple contributors.
The HTTPS/backend split is a real deployment headache the README admits: WebContainer requires cross-origin isolation headers, which means the Vercel frontend can't talk to a plain HTTP NestJS backend, so self-hosting the full stack is non-trivial. The test coverage is essentially zero — there's one Hello.test.tsx in __tests__ and a vitest config, but nothing testing the actual editor logic, WebContainer lifecycle, or collaboration sync. Last commit was November 2024 and the demo server URL in the README is a raw IP address on port 3000, which will almost certainly be dead. The AI chat feature (src/components/ai/chat/) appears to be placeholder/demo data (data.tsx) with no real backend integration visible — it looks like a future stub that got committed prematurely.