I'm working on a project to create a drawing web app where users can draw, pick colors, and save their art. I'm using Flask for the backend and SQLite/SQLAlchemy for data storage. Importantly, I want to do this without the element. I've learned from ChatGPT that there are a couple of ways to handle this: using SVG paths for freehand strokes or a grid/pixel-art method. My goal isn't just to finish the app but to also learn about data structures in the process. I want to implement what I've been learning in my data structures and algorithms studies.
For the SVG method, I would store strokes as lists of points and maybe use a stack for undo/redo features. For the grid approach, I'd represent the drawing with a 2D color matrix and serialize it to JSON for the database. I'd love insights from anyone who has worked on similar projects:
- Which approach do you think is better for learning about data structures?
- Are there other data structures (like stacks, queues, hashmaps, trees, etc.) that I could integrate into this project?
- How can I structure this project well enough to avoid just dumping raw text into the database while still learning?
Thanks for any advice you can provide!
3 Answers
I can’t help but wonder why you’re avoiding the canvas element. It might seem complex, but you’d likely face fewer challenges using it than trying to recreate those functionalities from scratch. If you're focusing on learning, working with the intended tech can actually give you deeper insights.
True! Though you could still learn a lot by trying your own method - at least it could push you to grasp some foundational concepts.
Exploring vector graphics will give you hands-on experience with various data structures. Think about:
1. Storing geometry for freehand paths and 2D shapes.
2. Keeping track of color data for these shapes.
3. Implementing an undo/redo feature to practice stacks and queues.
All these elements involve different types of data structures, offering a solid chance to learn how they work in practice!
Any resource you’d recommend for learning these data structures effectively?
I’m definitely looking for resources too! It’d be great to share favorites.
If you're focusing on learning, consider diving into vector math from the get-go. Don't treat ChatGPT as the final answer; it can provide guidance, but you might find that resource management and performance become complex, especially with SVG paths drawn dynamically using JavaScript.
That’s a good point! Any tips for balancing performance with functionality?
Yeah, I’m still figuring that out myself! It seems like using SVG could be trickier for dynamic drawings than I initially thought.

I get what you're saying. I’ve avoided canvas too, just thinking it wouldn’t be necessary. But now, I see how using it can simplify things a lot. There’s a lot of built-in functionality that could help with your learning!