Collaborative Whiteboard

Collaborative Whiteboard is a real-time whiteboard application that enables users to create rooms and collaborate visually with others. It fosters teamwork and creativity across distances through an intuitive and responsive interface.

Features

• Room Creation: Create or join shared whiteboard sessions using a unique Room ID.
• Real-Time Collaboration: Sketch and collaborate with other users in real time.
• Customizable Tools: Adjust brush color and size for a personalized drawing experience.
• Save and Load Sessions: Save whiteboard sessions and reload them later to continue working.

Tech Stack

• Frontend: React.js (TypeScript)
• Backend: Express.js, Node.js
• Database: PostgreSQL
• Real-Time Communication: Socket.IO

Installation

Follow these steps to set up and run the application locally:

Frontend

1. Navigate to the client directory:

   cd client

2. Install dependencies:

   npm install

3. Start the development server:

   npm run dev

Backend

1. Navigate to the server directory:

   cd server

2. Install dependencies:

   npm install

3. Start the backend server:

   node server.js

Usage

1. Launch the frontend and backend servers.
2. Open the application in your browser.
3. Create or join a room by entering a Room ID.
4. Start collaborating in real time with others.