Collaborative Jam Space

A real-time, multiplayer whiteboard where remote teams can draw, chat, brainstorm, talk (audio/video), and share music—all in one seamless workspace.

Built with MERN stack, mediasoup (WebRTC), Tailwind CSS, React Flow, and Socket.io for blazing-fast collaboration.

---

🌟 Overview

Collaborative Jam Space gives teams and friends a powerful shared space to:

• Draw, sketch, and create shapes and mind-maps together (like FigJam)
• Chat in real time
• Start voice/video calls right in the workspace
• Let hosts share music for a "virtual vibe"
• Prepare for future minigames (like Skribbl integration)

---

🚀 Features

• Real-time Whiteboard
  • Freehand drawing, rectangles/circles, move/resize/undo, color & font selectors
  • Multi-cursor presence, draggable text, theme switcher
• Persistent Chat
  • Board-based rooms, scrollback, notifications
• Voice/Video
  • WebRTC audio/video, basic grid layout (mediasoup SFU—expandable)
• Music Streaming
  • Host can queue/play YouTube links, stream audio (stubbed for MVP)
• Ready for Expansion
  • Hooks to add games (like Skribbl), AI copilot, and mobile PWA in future

---

🛠 Tech Stack

• Frontend: React 18, Vite, Tailwind CSS, React Flow, Socket.io-client
• Backend: Node.js, Express, mediasoup, Socket.io, MongoDB, Mongoose
• Auth: JWT (or Clerk, optional)
• Real-time/CRDT: Liveblocks (can swap for open-source approach)
• Deployment: Vercel (frontend), Render or Docker (backend)
• Testing: Vitest, React Testing Library, k6 load

---