https://github.com/ctrly4sh/syncflow

Uni minor project 😭
https://github.com/ctrly4sh/syncflow

nodejs opensource webrtc

Last synced: 22 days ago
JSON representation

Uni minor project 😭

• Host: GitHub
• URL: https://github.com/ctrly4sh/syncflow
• Owner: ctrly4sh
• Created: 2024-07-13T12:19:27.000Z (4 months ago)
• Default Branch: main
• Last Pushed: 2024-10-02T16:36:22.000Z (about 1 month ago)
• Last Synced: 2024-10-04T22:15:11.260Z (about 1 month ago)
• Topics: nodejs, opensource, webrtc
• Language: JavaScript
• Homepage:
• Size: 258 KB
• Stars: 0
• Watchers: 2
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        


## 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](https://www.gnu.org/licenses/gpl-3.0.en.html#license-text).

📧 Contact [y4sh.dev]([email protected])