Skip to content

Latest commit

 

History

History
69 lines (53 loc) · 2.51 KB

README.md

File metadata and controls

69 lines (53 loc) · 2.51 KB
Raw

Whiteboard: A Minimalist Drawing App

Whiteboard is a responsive drawing application built using the Canvas native API in React.

Live Preview

Whiteboard app demo video

Key Features

🎨 Light & Dark Themes

Switch between light and dark themes for an optimal drawing experience that suits any environment.

✏️ Customizable Pen

Change pen colors and stroke width to bring your ideas to life in vibrant ways.

🧹 Magic Eraser

The eraser dynamically adjusts its size based on cursor speed, making it faster and more efficient to correct mistakes or clear sections.

📱 Responsive Design

Whiteboard is optimized for all device sizes, ensuring seamless use across desktops, tablets, and mobile devices.

Purpose

This project was developed with the following goals:

  1. Learning the Canvas Native API: Gaining hands-on experience to understand its features and capabilities.
  2. Learning React: Using this project as a foundation to transition into learning and applying React for modern web applications.

Upcoming Features

I have planned to add these features in future updates:

  • Shape Tools: Easily draw predefined shapes like circles, rectangles, and lines.
  • Save and Export: Enable users to save their creations as image files for offline use.
  • Layer Management: Introduce layers to organize and edit drawings more effectively.

Get Started

Follow these steps to run Whiteboard locally:

  1. Clone the repository:
  git clone https://github.com/MAliHassanDev/WhiteBoard.git
  1. Navigate to the project directory:
    cd WhiteBoard
  1. Install dependencies:
    npm install
  1. Run dev server:
    npm run dev

Contributing

If you'd like to work on upcoming features, follow these steps:

  1. Fork the repository.
  2. Create a new branch (git checkout -b feature-name).
  3. Make your changes and commit them (git commit -am 'Add new feature').
  4. Push to your branch (git push origin feature-name).
  5. Create a pull request.

Please ensure your code adheres to the existing coding standards and includes tests where applicable.

License

This project is licensed under the MIT License - see the LICENSE file for details.

🧭 Navigation