Hacker Newsnew | past | comments | ask | show | jobs | submitlogin

When I was teaching programming my go-to was the JavaScript canvas api. It’s 2d only, and very simple. And being on the web once a student has made something we can host it for them and they can show their friends.

I have a ~20 line html harness which sets up a page with a full screen canvas element and gives you global window width & height variables. That’s all you need to get started. And it’s real JavaScript - so students learn a useful programming language as a result, and the advanced students can go nuts and add sprites, sound and networking if they really want to.




Any chance you have an example of what you are talking about


Yeah this is the template I use. As I say - its like, ~20 lines of boilerplate:

http://josephg.com/canvas_f.zip

I tell people to leave the html file alone and edit the javascript, using the canvas API to make it draw whatever they want. Canvas supports text, shapes and images and translations / transformations. If they want, I show them how to animate their work as well.

People make fun cursed things like this:

https://home.seph.codes/public/niamh/


Another option is to use the p5.js library. They also have a nice online editor, at https://editor.p5js.org/, which makes it easy for students to get up and running quickly.




Consider applying for YC's Fall 2025 batch! Applications are open till Aug 4

Guidelines | FAQ | Lists | API | Security | Legal | Apply to YC | Contact

Search: