DEV Community

Cover image for Never code lines on the HTML canvas again
UnionForever
UnionForever

Posted on

Never code lines on the HTML canvas again

Would you like to spend your morning, afternoon and evening coding this with Rough.js, or worse, writing this with the canvas API?

A map of the US drawn roughly

or would you like to draw this in… 30 minutes without writing code?

Canvascript is an open source no code tool to make sure that you do not waste your time on writing code and tracking coordinates for doing something as creative as creating graphics for the canvas.

Simply draw your graphics, then click on the generate code button to get the code that renders your graphic on the HTML canvas

Why did I need to draw whatever this is?

You can draw straight lines, curved lines and even freehand.

You can control the color and width of your brush.

You can redo, undo and save your drawings.

You can test your graphics on multiple resolutions.

You can even import and export drawings if you want to edit someone else’s graphic

Hell, with some modifications to the source code, you can even make 3D drawings that render on the HTML canvas

All without writing a single line of code

Why the HTML canvas? because that’s the only standard on the web that’s performant and mobile friendly enough for web game devs. That makes it a tool for web game devs, in fact the repository’s main page makes that quite clear, but it can be useful to anyone making graphics that render fast and on mobile

You don’t have to install or download anything, you can open CS right by going to their repository on Github and clicking on their app’s link

                                    ***
Enter fullscreen mode Exit fullscreen mode

This is my first blog on writing about such amazing and underated open source projects for web game and frontend devs.

An underated project is a project is one which has < 50 stars and < 10 forks

Do you have any thoughts about this story? do you know or own any hidden gems? Let me know below



Top comments (0)