Whiteboard

I wanted to challenge myself in being able to build a rich UI experience so I thought a whiteboard application like Google's Jamboard or the Miro

Built using React & Konva

Features TODO:

• draw

  • change color
  • change line thickness

• erase

• add sticky note

  • selectable and resizable
  • able to change font size in note
  • able to change alignment in note
  • able to change background color of note
  • delete note (add X in top right corner when selected)
  • NICE TO HAVE: draw within note and it scales with note

• Free text writing

  • selectable and resizable
  • delete text (add X in top right corner when selected)

• top nav

  • undo/redo ui buttons
  • zoom in/out ui buttons (or maybe this should go by the mini map)
  • save as image (full size, not just window)
  • export json
  • load from exported json

• keyboard shortcuts

  • shortcut for each tool
  • undo
  • redo
  • increase/decrease using [ ]
  • zoom in/out

• pan

• zoom

• Mini map?

• embed an image and resize it (url only, no uploading)

• P2P multi-user using PeerJS

---

helpful links:

https://redux.js.org/recipes/implementing-undo-history#using-redux-undo

https://casesandberg.github.io/react-color/

Font-Awesome 5 Free icons

Entypo Fonts via IconMoon