Skip to content

MarkE16/LiveCanvas

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

IdeaDrawn | LiveCanvas

🖼️ About IdeaDrawn

Welcome to IdeaDrawn, a real time, open source platform for artists, developers, and tech enthusiasts to draw, share, and collaborate on a digital canvas! Join our growing community and be part of something innovative!

We're building a space where creativity thrives, and we’d love for you to be part of it! You can:

  • Contribute Code – Help improve features, fix bugs, or suggest enhancements.
  • 🛠 Test New Features – Try out the latest updates and give feedback.
  • Support the Project – Click the star button to help us grow!

Every contribution, big or small, makes a difference. Join us and help shape the future of IdeaDrawn! 🚀

Please note that this project is in the beginning of its development stages, so there is not an expected stable release of the software at the moment.

🤠 Features

  • 🎨 Basic Editing Tools
  • 🟩 Shape Tools
  • 🔆 Selection Tools
  • 🖥️ Layer System
  • 💾 File Management
  • Optimized Performance
  • + MORE

📖 Tech Stack

  • Vite + SSR + React.js
  • Zustand State Manager
  • Vitest Testing Framework
  • Docker

Setup

Prerequisites

  • Install Node.js
  • Install pnpm, as this project uses this package manager instead of the usual npm provided by Node.js.

To run the application locally, start by cloning the repo and navigating into the directory:

$ git clone https://github.com/MarkE16/LiveCanvas

... cloning ...

$ cd LiveCanvas # after clone is complete.

Next, install all the required packages (see prerequisites if you don't have pnpm installed).

$ pnpm install

Almost done! All that's left now is to run the project. To start up the project:

$ pnpm run dev

You're all set!

Discord Community

Feel free to join IdeaDrawn Discord community to find a place to connect with others. Anyone is welcome to strike a conversation, lurk, or give suggestions.

Contribution

  • ⭐ We're actively seeking skilled web developers to contribute on maintaining this project. If you're interested, reach out to @MarkE16, we'd love to work with you!

Why should you contribute?

  • 💡 Experience - Unlike basic e-commerce sites, this project challenges you to write logic for a drawing editor.
  • 😎 Learning - While React.js is widely used, building an editor allows you to deepen your knowledge and face new challenges. It’s also a great opportunity to learn how to write tests if you haven’t already.
  • Visibility - Contributing to open-source is both enjoyable and valuable, enhancing your experience and credibility in collaborative projects.

If you are interested in taking the time to propose code implementation, feel free to fork the repo and make a pull request.