Skip to content

I created a lightweight canvas editor using only vanilla JavaScript, with no frameworks. It lets users import images, draw freely, add text, and resize elements dynamically. The goal was to provide a simplified “mini-Canva” experience in the browser, keeping the project clean, efficient, and fully interactive.

License

Notifications You must be signed in to change notification settings

hoophopp/Editor

Repository files navigation

Vanilla JavaScript Canvas Editor

This repository contains an early-stage project I developed while learning JavaScript.
The goal was to explore the HTML5 Canvas API by building a lightweight editor that allows users to draw, import images, and adjust elements—similar in concept to simple design tools.

Although the project is not finished, it represents an important step in my learning journey and experimentation with front-end development.


Features (Work in Progress)

  • Freehand drawing on canvas
  • Basic element resizing
  • Image import support
  • Text element placement
  • Built with pure JavaScript, no external frameworks

Project Status

This project is incomplete and was created primarily as a learning exercise.
It is not production-ready, but it demonstrates:

  • Practical use of the Canvas API
  • Event handling and user interactions
  • Dynamic rendering without external libraries

Lessons Learned

  • Structuring front-end projects without frameworks
  • Handling real-time user input on the canvas
  • Fundamentals of DOM and canvas manipulation
  • Early understanding of scalable project design

Possible Future Improvements

  • Layer management system
  • Color picker and font customization
  • Export and save functionality
  • Enhanced UI/UX design

Note

This is an old project from my early JavaScript practice.
It remains unfinished but serves as a milestone in my development journey, showing where I started and how far I’ve progressed.

About

I created a lightweight canvas editor using only vanilla JavaScript, with no frameworks. It lets users import images, draw freely, add text, and resize elements dynamically. The goal was to provide a simplified “mini-Canva” experience in the browser, keeping the project clean, efficient, and fully interactive.

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published