Codemoji Coding Hour · Lesson plan
🐼 Code a game in JavaScript
Grades 6-8 · 60 minutes · Some typing · Start at codemoji.com/lessons/js/catch/1
Students will
write real JavaScript that moves a character, makes things fall and keeps score.
The big idea
A program is a list of exact instructions; variables remember things, like the score, while the game runs.
Before the hour
- Do lessons 1-3 yourself (about 15 minutes).
- Decide on accounts: students can play as guests, or join your class with its code so their progress (and certificate) is saved.
- Check typing is comfortable on your devices; pairs (one types, one reads) work well.
Warm-up (away from screens)
Robot teacher: a student is the "computer" and follows the class's instructions exactly to walk to the door. Show how one fuzzy instruction breaks it. Code has to be exact too.
The hour
- 0-5 minWarm-up. Robot teacher. Then show the finished Panda Catch.
- 5-10 minGet started. Open lesson 1. Show the checklist: each line ticks as it is typed right. Show "Show example" for help.
- 10-45 minCode. Lessons 1-6: the panda, walking, apples falling, the score, catching and the bee. Aim for lesson 4 by minute 25.
- 45-55 minShow and share. Partners play each other's game and read one line of the other's code aloud.
- 55-60 minWrap-up. Certificates. Ask: what does a variable remember in your game?
The lessons
- 1. Meet the Panda
- 2. Walk Around
- 3. Apple Rain
- 4. Keep Score
- 5. Catch It!
- 6. Watch Out!
Where students get stuck
An error message appears
Read the friendly hint: it names the line and often says "did you mean". Check brackets and quote marks.
A line will not tick
Compare it with the step, letter by letter. Capitals do not matter, spelling does.
Nothing happens on Run
Press Run again after each change. The code only runs when you press it.
Talk about it
- What does the score variable do?
- What happened when you made a typo? How did you find it?
- What would you change to make the game harder?
Fast finishers
- Keep going: lessons 7-10 add rules, lives and winning.
- Try Rocket Launch, another game written line by line.
Words to know
- JavaScript:
- The language that makes web pages and games move.
- Variable:
- A named box that remembers a value, like the score.
- Bug:
- A mistake in code. Finding and fixing it is debugging.
After the hour
Hand out Codemoji Coding Hour certificates: students who finished signed in to your class have theirs ready in your class's Certificates tab, and you can print any class by name. Standards: CSTA 2-AP-11 / 2-AP-17: create programs with variables; debug systematically.