Teaching coding to kids

Recently I was invited to teach an 80 minute programming class to a small class of high school students with special needs. I'm aware of some fantastic resources such as Hour of Code, which provides free short coding activities designed for absolute beginners. However, I find that these activities don't always feel "real" - you're usually writing code within a web app that feels like a game, and after writing the code required it feels more like you've simply won a game instead of having actually created an app that can be run and shared with others. Hour of Code is great for teaching students the logical thinking required when coding, but I feel like it misses the potential excitement that one could have in finding that they can actually build an app like the ones they use each day.

So I decided to try designing my own class to introduce students to code. My aims were:

• Zero setup - students should not need to install anything new on their laptops
• Students should use a real programming language
• Students should start with an empty file, type some code in it, and run it to see the result
• Students should need to copy as little boilerplate code as possible
• The code should do something visual and fun
• The code should use very simple programming concepts such as function calls, and basic control flow

And so I created Tribot, a library that allows programmers to easily create a website where a triangular robot (or Tribot) attempts to retrieve some treasure.

I wasn't sure how it would go. I was worried that my class might be too advanced for the students, and they would just become frustrated. Or maybe they would find it boring compared to the more game-like Hour of Code activities that are available.

Anyway, here's how it went.

First I introduced myself, explaining that I was a software developer who makes apps and games. The students all had laptops, and I got them all to open up Chrome and showed them how to open the DevTools, which they'd never seen before. They then followed along as I executed some basic commands into the console. They learned how to do a JavaScript alert, a prompt, and basic control flow as we wrote a very simple program like the following:

let name = prompt("What is your name?")
if (name == "Bob") {
  alert("Hello Bob!!!")
} else {
  alert("What an interesting name!")
}

Having experienced the basics of JavaScript, it was time to introduce the Tribot. I got them to open up TextEdit/Notepad, and they copied the following boilerplate, which imported the library I created:

<script type="module" src="https://unpkg.com/tribot"></script>
<script type="module">
// Your code goes here
</script>

I then showed them how to save this as index.html and open the file in their browser, and they saw this:

Clicking "Start" didn't do anything - it was up to them to make the robot go to the treasure. I showed them a few commands, and they soon got the hang of it - they could move the robot with commands like the following:

moveForward()
turnRight()
moveForward()

They could also have fun running functions to change the Tribot's colour and make it beep.

At this point they quickly got into the hang of changing some code, saving the file, and refreshing the browser to run it.

(If you know JavaScript you may be confused about how the code is working under the hood - how can they call synchronous functions to move the Tribot without freezing the browser? The answer is that when we load the page we run the whole script but simply save the actions performed, and then gradually replay them with some delays to animate the Tribot.)

Soon enough some of the students were able to get the Tribot to reach the treasure. At this point I told them that there was another function they could call at the start of their script - setRoom(2) to change to another room. And there were 3 rooms in total for them to try.

Some of the students were able to quickly get the Tribot winning in these rooms, so I then revealed that they could create their own custom rooms:

setRoom([
  [S,_,_,_],
  [W,_,_,W],
  [T,_,_,W]
])

And finally I challenged them to see whether they could write some code for a Tribot that could find the treasure in any room without needing its code changed.

Overall the students seemed to enjoy the class, and were all able to get through at least part of the activity. Some of them were asking really good questions about how they could go about putting this web app on the internet, or how they could add keyboard controls to the Tribot.

Very exciting to see how fast these students were able to learn some simple programming - I'm sure they all have bright futures ahead of them.

The Tribot code is open source and freely available on GitHub.