Editor Environment Highlight for Kids

Hi, I am currently teaching a group of 11 to 12 year olds how to code simple games in javascript.
I’m trying to teach them about how functions work.
I was wondering if there could be a feature in the editor that displays a colour for any region between curly brackets and regular brackets. Something like this?
I think this will help the students to see where to write code.

1 Like

none of that I know, but since CodeMirror (used by most of the browser based coding environment) supports bracket matching it should be possible to implement - or you may be able to make it by cloning the p5.js editor and add your theme (which is not easy if you are not familiar with docker/html/css)

Reminds me a little of frame-based editing as here, although it’s not JavaScript.


Can you DM me about a paid project?

Hi! This looks like an interesting idea!

I don’t know any editor like that … but since you asked about a coding environment for kids – I want to highlight you codeguppy.com

It is an online coding environment based on p5.js for kids. It has also certain features on top of p5.js to make easier game dev. For instance it supports Microsoft MakeCode type-in sprites: