+1 for the DOM Inspector. I have found that kids LOVE pulling back the curtain on a website to see the wizard and play with the code. A fun activity is to have them go to a news site and have them edit the headlines and replace the images to silly things and take screenshots to share with their parents. What really impresses me with this exercise is how quickly some kids will figure out some intermediate hacks when they learn how easy it is to google the things they want to do.
Another suggestion that works for the same reason is to give kids code to play with. I've wasted 20 minutes of class time having kids write a three line "Hello World!" javascript program from scratch. All this did was irritate and bore the kids out of their minds as they struggled with syntax and hunt-and-peck typing.
Instead, when I give kids a great big block of javascript code that does something fun and animated, those kids will go wild with it. This is because changes to different variables can have big effects. They quickly learn to read the code and identify what different parts do. They break the code, and you show them how that's a good thing and how easy it is to revert it back so that it's working again. Code should be a playground. Give the kids a rich playground to run around in.
I think you said that better than me. I'm stealing this line as it's to good not to - "Code should be a playground. Give the kids a rich playground to run around in." Let me know if you want me to credit it to you ever.
Just something that came to mind reading this great comment, have you considered using webcam + canvas manipulation for that great block of fun Javascript? I've been doing Javascript30 (https://javascript30.com/), and day 19 (unreal webcam fun) he showed doing live image filters with simple pixel manipulation on a canvas populated by the user's webcam - it was awesome, I think kids would love it, and it lends itself really nicely to your model of a pile of variables to play with and break. That course is free (no affiliation but it's awesome!) and all the code is on Github, the webcam one is here: https://github.com/wesbos/JavaScript30/tree/master/19%20-%20...
> Instead, when I give kids a great big block of javascript code that does something fun and animated, those kids will go wild with it. This is because changes to different variables can have big effects.
I remember being a kid and typing in Mandelbrot code from a BASIC computer magazine. Even though I didn't understand the code, I had endless amounts of fun with stuff like that for exactly this reason.
It's what sparked my imagination and interest in programming.
If you think about it, it's imitating how a lot of us auto-didacts learnt to code, especially in the 2000s.
Got some script for modifying a game or an excel function or some code that doesn't quite do what we want it to. Bash it with random changes until you suddenly fix/change/etc. it.
Get a bit addicted, rinse, repeat, suddenly a month later you can understand most of the code.
Another suggestion that works for the same reason is to give kids code to play with. I've wasted 20 minutes of class time having kids write a three line "Hello World!" javascript program from scratch. All this did was irritate and bore the kids out of their minds as they struggled with syntax and hunt-and-peck typing.
Instead, when I give kids a great big block of javascript code that does something fun and animated, those kids will go wild with it. This is because changes to different variables can have big effects. They quickly learn to read the code and identify what different parts do. They break the code, and you show them how that's a good thing and how easy it is to revert it back so that it's working again. Code should be a playground. Give the kids a rich playground to run around in.