View Project
CoSketch is a real-time collaborative drawing platform built to explore modern full-stack development, real-time communication, and scalable architecture. The application allows multiple users to draw, move, resize, and style shapes (like rectangles, ellipses, arrows, lines, and diamonds) on a shared canvas — all synchronised in real-time using WebSockets.
This project was created as a deep dive into building full-stack systems with live collaboration features. From WebSocket communication and custom shape management to Docker-based development and CI/CD deployment with GitHub Actions, CoSketch reflects a strong foundation in scalable engineering practices and product thinking.
Tech Stack
Frontend: Next.js, TypeScript, Tailwind CSS, Zustand, @tanstack/react-query
Backend: Express.js, WebSocket server (ws), Node.js
DevOps: Docker, GitHub Actions, CI/CD workflows
Architecture: Turborepo monorepo setup using Bun as the JS runtime
Key Features
Real-time Collaboration: Draw and interact live with others on the same canvas
Interactive Tools: Select, move, resize, style, and delete shapes
Modular Architecture: Cleanly separated frontend, backend, and socket server
Dockerized: Easy local development with Docker support
CI/CD Ready: Automated deployment pipeline using GitHub Actions
Built with
