🧮 Whiteboard UI

Organize your ideas to diagrams!

Technologies • How to Use • Improvement Ideas • Author

---

🚀 Technologies

🎯 Objective

This project was made in order to learn about React Flow library, while in the process creating a cool project where you can organize your ideas into diagrams and later be able to save these diagrams and use them externally.

I have plans to add more features to this project as I progress with my studies. You can check on improvment ideas section.

User should be able to:

• Add square and pill shape
• Connect shapes
• Resize shapes

💡 Improvement Ideas

• Change shapes colors
• Remove shapes & connections
• Add text to connection
• Add text on shape
• Multiple people connect to same board
• Show mouse location for each member on board
• New Shapes:
  • Circle
  • Rectangle
  • Oval
  • Diamond
  • Cone
  • Parallelogram

ℹ️ How to Use

Before cloning the repository into your machine you'll need: Git and NodeJS. Also it is good to have a code editor like VSCode.

#Clone this repository
$ git clone https://github.com/davyd-souza/whiteboard-ui.git whiteboard-ui

#Go into the repository
$ cd whiteboard-ui

# Install dependencies with
$ npm install # or
$ yarn

# Run app
$ npm start   # or
$ yarn dev

👤 Author

Made with 💛 by Davyd Souza