SyncFlow 🎨

SyncFlow is an one-to-one real-time collaborative web application designed for programmers and developers. It allows users to create and discuss Low-Level Designs (LLD), algorithms, and flowcharts on a shared canvas with real-time updates and seamless interaction. It also provides cloud-based design snap sharing.

✨ Features

• Real-Time Collaboration: Design and chat with another developer in real-time.

• Interactive Chat: Communicate seamlessly within the app.

• Canvas Screenshot Capture: Capture and upload canvas snapshots to Cloudinary.

• Responsive Design: Designed with MUI and Tailwind CSS for a responsive UI.

• Optional Authentication: Secure user authentication for personalized access (optional).

  🚀 Technologies Used

• Frontend: React, MUI, Tailwind CSS

• Backend: Node.js, Express.js, Socket.IO

• Cloud Storage: Cloudinary

• Other Tools: HTML5 Canvas API, JWT

  🛠️ Getting Started

  Prerequisites

• Node.js installed on your local machine

• npm or yarn package manager

  Installation

1. Clone the repository:

git clone https://github.com/ctrly4sh/Sync-Canvas.git cd Sync-Canvas

2. Install dependencies:

npm install

3. Set up environment variables:

• Create a .env file in the root directory.
• Add your Cloudinary credentials and other necessary variables.

4. Start the development server:

npm start

5. Open your browser:

• Navigate to http://localhost:3000 to view the app.

🎯 Usage

• Register/login to access the canvas.

• Draw on the canvas using the tools provided.

• Chat with the other user in real-time.

• Use the "Capture & Upload" button to save canvas snapshots to Cloudinary.

  🤝 Contributing

Contributions are welcome! Feel free to fork the repository and submit pull requests.

📄 License

This project is licensed under the GNU License.

📧 Contact y4sh.dev