Skip to content

Latest commit

 

History

History
73 lines (47 loc) · 2.96 KB

README.md

File metadata and controls

73 lines (47 loc) · 2.96 KB
Raw

Collaborative Whiteboard - Miro Clone

This project is inspired by Miro, a collaborative online whiteboard platform, built using Next.js, TypeScript, Liveblock, Convex, and Clerk. Video of Real-time users using the canvas: https://drive.google.com/file/d/1PV5YY5vf0w7jFi3vC1SCS-Pg7WwW60Dg/view?usp=drive_link

Features

  • Whiteboard Functionality: Users can create and collaborate on virtual whiteboards.
  • Real-time Collaboration: Utilizes Liveblock for real-time collaboration, allowing multiple users to interact simultaneously.
  • Authentication: Integrated Clerk for user authentication, ensuring secure access to the application.
  • Persistence: Data is stored and managed using Convex, providing a reliable storage solution for board content.

Technologies Used

  • Next.js: A React framework for building server-side rendered and statically generated web applications.
  • TypeScript: A statically typed superset of JavaScript that enhances code quality and developer productivity.
  • Liveblock: A real-time collaboration platform for adding live collaboration features to applications.
  • Convex: A data persistence and synchronization service for building collaborative applications.
  • Clerk: A user authentication and identity management service for modern web applications.

Installation

  1. Clone the repository: git clone https://github.com/Siddharth263/collaborative-whiteboard.git

  2. Navigate to the project directory: cd collaborative-whiteboard

  3. Install dependencies: npm install

  4. Set up environment variables: Create a .env.local file in the root directory and add the following variables:

    CONVEX_DEPLOYMENT=your convex development link
NEXT_PUBLIC_CONVEX_URL=your convex URL
CLERK_SECRET_KEY=your-clerk-secret-key
NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY=your clerk pk

  5. Run the development server: npm run dev

  6. Open http://localhost:3000 in your browser to view the application.

Screenshots

Landing_Page

After_Login

Creating_Organisation

Account

Creating_Boards

Inside_Organisation

Inviting_Members

Receiving_Invites

Orgaisation_Setting

Renaming_Board_Real_Time

Responsive_Screens

Contributing

Contributions are welcome! If you have any features or found a bug and want to fix it, please fork the repository, and put in a pull request for review. Thank you!

License

This project is licensed under the MIT License.

Acknowledgements

  • This project was inspired by Miro
  • Built with ❤️ by Priyanshu.