WhizBoard is a collaborative brainstorming application designed to bring your team's ideas together in a seamless and interactive way. Drawing inspiration from platforms like Miro, WhizBoard provides a digital SVG Canvas where you can brainstorm, strategize, and visualize your ideas in real-time.
-
Your Own Whizboard: Create your own private whiteboard to brainstorm, strategize, and visualize your personal ideas. You can also create public boards to share with others, or a team board to collaborate with your team!
-
Real-Time Collaboration: Brainstorm with your team in real-time, regardless of your geographical location. Changes made by users are instantly reflected on the board. Powered by LiveBlocks.
-
Lightweight SVG Canvas: WhizBoard uses an SVG canvas that is build from scratch to render your ideas. This allows for a smooth and interactive experience, even with a large number of elements on the board. Though, it may not be performant like other third-party canvas libraries.
-
Interactive Elements: Add interactive elements like sticky notes, shapes, lines, and text to your board. You can also pan and zoom to navigate the board easily.
-
Versatile Tools: Use a variety of tools like sticky notes, shapes, lines, and text to capture and organize your thoughts.
-
Multiple Themes: Choose from multiple themes to customize the look and feel of your board. With predefined set of cool themes from DaisyUI.
-
Easy Navigation: Navigate the board easily with pan and
zoomfunctionality. You can also follow other users to see what they're working on. -
Export and Share: Export your boards to various formats like PDF or PNG. Share your boards with others, even if they don't have a WhizBoard account.
WhizBoard is built using the following technologies:
- Next.js: A React framework for building server-rendered applications.
- Clerk: A user authentication and identity management platform.
- LiveBlocks: A real-time collaboration platform for building collaborative applications.
- Tailwind CSS: A utility-first CSS framework for building custom designs.
- SVG: Scalable Vector Graphics for rendering the board.
- DaisyUI: A component library for Tailwind CSS.
- Phosphor Icons: A flexible icon set for Tailwind CSS.
Demo: https://whizboard.netlify.app/
To get started with WhizBoard, clone the repository and install the dependencies:
git clone https://github.com/a1x5h04/whizboard-web.git
cd whizboard-web
npm installThen, start the development server:
npm run devOpen http://localhost:3000 with your browser to see the result.
We welcome contributions from everyone. If you're interested in contributing, please see our Contributing Guide.
WhizBoard is MIT licensed.