CollabCanvas

A flexible, real-time collaborative whiteboard empowering teams to create, share, and innovate seamlessly.

CollabCanvas is a real-time collaborative whiteboard tool for seamless team collaboration, designed as a replacement for Jamboard. It provides intuitive drawing tools, real-time sharing, and scalable workflows to boost team creativity.

---

🚀 Features

• 🎨 Interactive Drawing Tools: Pen, shapes, text annotation, and eraser.
• 🔄 Real-Time Collaboration: Changes are synchronized instantly for all users.
• 💾 Session Management: Save and load collaborative sessions.
• 🖌️ User-Friendly UI: A clean and responsive interface powered by React.js.
• 📈 Scalability: Backend and database designed for growth.

---

🛠️ Tech Stack

Frontend

• React.js
• Canvas API
• CSS Modules / Styled Components

Backend

• Node.js & Express.js
• Socket.IO for real-time communication

Database

• SQLite (Initial Version)
• MongoDB (Future Scalability)

Deployment

• Frontend: Vercel
• Backend: Render

---

🎯 Goals

1. Implement basic drawing tools:
   • Pen, shapes, text annotations, and eraser.
2. Enable real-time collaboration using WebSockets.
3. Provide session save/load functionality.
4. Deploy the frontend and backend for public access.

---

🖥️ How to Run the Project

Prerequisites

Make sure you have the following installed:

• Node.js
• NPM

Setup Instructions

1. Clone the Repository:

   git clone https://github.com/your-repo-name/collabcanvas.git
   cd collabcanvas