fuzheng1998 / apps.whiteboard

Whiteboard Integration App for Rocket.Chat

Whiteboard App for Rocket.Chat

Enhance your collaborative experience with diagrams, drawings, and more using Whiteboard Integration in Rocket.Chat. Whiteboard App provides a seamless environment for real-time visual communication and brainstorming.

How to Use App

Create Whiteboard

Through Slash Commands:

• Use /whiteboard new to create a new whiteboard.

• Use /whiteboard help for a helper message.

Through Action Buttons:

• Click on the "Create Whiteboard" action button to create a new whiteboard.

Using Whiteboard

• Click on Edit board button and you will be directed to a new whiteboard tab.

• User's edits will be stored in realtime as a image preview in the message.

• Click on Settings button to modify boardname and make board public/private.

Whiteboard App Policies

• Privacy Policy
• Terms of Use

Local Setup Guide

1. Navigate to the client folder:

   cd client

2. Install all required packages:

   npm install

3. Build the webpack bundle for the Excalidraw React app:

   npm run build

4. Execute the build.js script to generate build scripts for excalidraw.ts and excalidrawContent.ts:

   npm run build:excalidraw

5. Change directory to whiteboard and install all Rocket chat app packages :

   cd ../whiteboard/

   npm install

6. Deploy your app locally

   rc-apps deploy --url http://localhost:3000 --username ${username} --password ${password}

   Verify the successful build by accessing the /excalidraw endpoint in the Whiteboard app settings. You can access the React app through the provided URL.

GSoC'23 Work: Whiteboard App Report

Resources

Explore our documentation and engage with the Rocket.Chat Apps community:

• Rocket.Chat Apps TypeScript Definitions Documentation: Learn about Rocket.Chat Apps TypeScript definitions and how to use them.

  • Documentation

• Rocket.Chat Apps TypeScript Definitions Repository: Contribute and explore the open-source repository for Rocket.Chat Apps TypeScript definitions.

  • GitHub Repository

• Example Rocket.Chat Apps: Find inspiration in a collection of example Rocket.Chat Apps, providing practical implementations.

  • Example Apps

• Community Forums: Engage with the Rocket.Chat Apps community through our forums.

  • App Requests
  • App Guides
  • Community Forums

• Community Chat Channel: Join the conversation in our community chat channel.

  • #rocketchat-apps on Open.Rocket.Chat

Feel free to explore, learn, and collaborate within the Rocket.Chat Apps ecosystem. Happy coding!