Skip to content

Virtual whiteboard for sketching hand-drawn like diagrams

License

Notifications You must be signed in to change notification settings

SWEETGOOD-DE/excalidraw-selfhosted

 
 

Repository files navigation

CURRENTLY THIS FORK HAS UNFIXED BUILD ERRORS

I'm trying to fix them together with others in this repository. Feel free to collaborate. 😎


This is a (hopefully temporary) fork from the original excalidraw project implementing:

  • The recent version of Excalidraw (as of 2024-05-22)
  • All the changes from b310-digital's fork (which brings support for rooms without using firebase). This fork is inspired and partly taken from Kilian Decaderincourt.
  • The yarn-build-fix from squatica
  • The redis db healthcheck from squatica
  • My own improvements regarding the docker-compose files and the redis configuration

==THIS REPOSITORY SHOULD NOT BE SEEN AS MID / LONG TERM SOLUTION== I would really appreciate the upstream maintainers to implement some kind of self-hostable solution into their repository. But as long as pull requests to forks are outstanding for months and one has to fix a lot of different small issues until an up to date version of Excalidraw is up and running this repository will hopefully do it's job. 😎

Run with docker compose

Adapt the password in .env.default and rename it to .env.

Development

Adapt the variables according to your needs in .env.development

Start the containers:

docker compose -f docker-compose-dev.yml up -d

Check the logs: docker compose logs -t -f

Production use

Adapt the variables according to your needs in .env.production

Start the containers:

docker compose -f docker-compose-prod.yml up -d

Check the logs: docker compose logs -t -f

Important

The collaboration mode requires a secure context (https). Localhost works as well, but http over a local network will throw errors in the browser console.


Instructions taken from b310-digital's fork

==Dunno if those instructions are still up to date and working==

Setup with docker

Please copy the .env.development.default or .env.production.default file to .env (or with environment without default at the end) and change it according to your needs, see react-scripts.

Development

docker-compose up -d
docker-compose exec excalidraw yarn install
docker-compose exec excalidraw yarn start

Hint: Collab mode requires a secure context (https). Localhost works as well, but not http over local network.

Commands

Command Description
yarn Install the dependencies
yarn start Run the project
yarn fix Reformat all files with Prettier
yarn test Run tests
yarn test:update Update test snapshots
yarn test:code Test for formatting with Prettier

Thanks

Excalidraw

An open source virtual hand-drawn style whiteboard.
Collaborative and end-to-end encrypted.


Excalidraw is released under the MIT license. npm downloads/month PRs welcome! Chat on Discord Follow Excalidraw on Twitter

Product showcase

Create beautiful hand-drawn like diagrams, wireframes, or whatever you like.

Features

The Excalidraw editor (npm package) supports:

  • 💯 Free & open-source.
  • 🎨 Infinite, canvas-based whiteboard.
  • ✍️ Hand-drawn like style.
  • 🌓 Dark mode.
  • 🏗️ Customizable.
  • 📷 Image support.
  • 😀 Shape libraries support.
  • 👅 Localization (i18n) support.
  • 🖼️ Export to PNG, SVG & clipboard.
  • 💾 Open format - export drawings as an .excalidraw json file.
  • ⚒️ Wide range of tools - rectangle, circle, diamond, arrow, line, free-draw, eraser...
  • ➡️ Arrow-binding & labeled arrows.
  • 🔙 Undo / Redo.
  • 🔍 Zoom and panning support.

Excalidraw.com

The app hosted at excalidraw.com is a minimal showcase of what you can build with Excalidraw. Its source code is part of this repository as well, and the app features:

  • 📡 PWA support (works offline).
  • 🤼 Real-time collaboration.
  • 🔒 End-to-end encryption.
  • 💾 Local-first support (autosaves to the browser).
  • 🔗 Shareable links (export to a readonly link you can share with others).

We'll be adding these features as drop-in plugins for the npm package in the future.

Quick start

Note: following instructions are for installing the Excalidraw npm package when integrating Excalidraw into your own app. To run the repository locally for development, please refer to our Development Guide.

npm install react react-dom @excalidraw/excalidraw

or via yarn

yarn add react react-dom @excalidraw/excalidraw

Check out our documentation for more details!

Contributing

Integrations

Who's integrating Excalidraw

Google CloudMetaCodeSandboxObsidian ExcalidrawReplitSliteNotionHackerRank • and many others

Sponsors & support

If you like the project, you can become a sponsor at Open Collective or use Excalidraw+.

Thank you for supporting Excalidraw

Last but not least, we're thankful to these companies for offering their services for free:

Vercel Sentry Crowdin

About

Virtual whiteboard for sketching hand-drawn like diagrams

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • TypeScript 89.4%
  • SCSS 4.4%
  • MDX 3.8%
  • JavaScript 2.2%
  • HTML 0.2%
  • CSS 0.0%