DrawingApp is a web-based drawing application built with React, Vite, and TypeScript. It enables users to create drawings using different color options and download their artwork as an image file. The application is developed with a focus on type safety using TypeScript, ensuring robust and maintainable code.
- Canvas Drawing: Users can freely draw on the canvas using mouse or touch input.
- Multiple Color Options: A variety of colors are available for drawing, allowing users to express their creativity.
- Download Artwork: After completing the drawing, users can download their creation as an image file.
- Type Safety: The application is built with TypeScript to ensure type safety and reduce potential bugs during development.
- React: Frontend library for building user interfaces.
- Vite: Fast build tool for modern web applications.
- TypeScript: Superset of JavaScript for adding static types.
- HTML5 Canvas: Used for drawing operations.
To run the application locally, follow these steps:
-
Clone the repository:
git clone https://github.com/Sushank-ghimire/DrawingApp.git
-
Navigate to the project directory:
cd DrawingApp -
Install the dependencies:
npm install
-
Start the development server:
npm run dev
-
Open your browser and go to
http://localhost:5173.
- Select a Color: Use the color palette to select your desired color for drawing.
- Draw on the Canvas: Use your mouse or touch input to create your artwork on the canvas.
- Download Your Drawing: Once finished, click the "Download" button to save your drawing as an image file.
- src/components: Contains the main components of the application.
- src/types: Type definitions for ensuring type safety across the app.
If you want to contribute to this project:
- Fork the repository.
- Create a new branch (
git checkout -b feature-branch). - Commit your changes (
git commit -m 'Add new feature'). - Push to the branch (
git push origin feature-branch). - Open a pull request.
This project is licensed under the MIT License. See the LICENSE file for more information.