https://github.com/noszczykmichal/canvas-editor
A small yet powerful app for creating posters built with React and Typescript.
https://github.com/noszczykmichal/canvas-editor
context-api eslint html2canvas pnpm prettier react react-transition-group sccs typescript vite
Last synced: about 2 months ago
JSON representation
A small yet powerful app for creating posters built with React and Typescript.
- Host: GitHub
- URL: https://github.com/noszczykmichal/canvas-editor
- Owner: noszczykmichal
- Created: 2025-01-29T17:12:55.000Z (4 months ago)
- Default Branch: main
- Last Pushed: 2025-02-16T16:29:09.000Z (3 months ago)
- Last Synced: 2025-02-16T17:35:06.368Z (3 months ago)
- Topics: context-api, eslint, html2canvas, pnpm, prettier, react, react-transition-group, sccs, typescript, vite
- Language: TypeScript
- Homepage: https://canvas-editor-44294.web.app
- Size: 690 KB
- Stars: 0
- Watchers: 1
- Forks: 1
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
![]()
Canvas Editor
A small, yet powerful app for creating posters built with React and Typescript, animated with React Transition Group, and hosted on Firebase.

## Table of Contents
- [General Info](#general-information)
- [Setup](#setup)
- [Credits](#credits)
- [Contact](#contact)## General Information
- This app allows generating banners with background, graphics and text. The size of the text and graphics can be adjusted to best fit the need and desired effect. Additionally, the colour of the text can be adjusted (currently supported colours: black, white, red, blue, and green).
- The graphics generated from the app have a fixed size of 1080px × 1350px and are in PNG format.## Setup
1. Clone this repository
```sh
$git clone https://github.com/noszczykmichal/canvas-editor
```2. Go into the repository
```sh
$cd canvas-editor
```3. Install dependencies
```sh
$pnpm install
```4. Start the development server
```sh
$pnpm run dev
```## Credits
This project was based on a design prepared by ByteFine.
## Contact
Created by [@noszczykmichal](https://michalnoszczyk.com/) - feel free to contact me!