- Programming content overview
- Tracking progress of programming students
- Classroom debugging guide
- Pair programming in the classroom
- Teaching guide: Intro to JS - Drawing Basics
- Teaching guide: Intro to JS - Coloring
- Teaching guide: Intro to JS - Variables
- Teaching guide: Intro to JS - Animation basics
- Teaching guide: Intro to JS - Interactive Programs
- Teaching guide: Intro to JS - Resizing with variable expressions
- Teaching guide: Intro to JS - Text and strings
- Teaching guide: Intro to JS - Functions
- Teaching guide: Intro to JS - Logic and if statements
- Teaching guide: Intro to JS - Looping
- Teaching guide: Intro to JS - Arrays
- Teaching guide: Intro to JS - Objects
- Teaching guide: Intro to JS - Object-oriented design
- Programming classroom handouts
- Additional programming projects
- Lesson plans: teaching programming in the classroom
- Programming case study: Encouraging cross-disciplinary projects
- Programming case study: Going beyond the KA curriculum
- Programming case study: Teaching an elementary school class
What the student will learn
- How to give the computer a command, by "calling a function."
- How to draw ellipses, rectangles, and lines, by calling different function names and passing in an appropriate number of parameters.
- The canvas grid on Khan Academy - 400x400 pixels, with 0,0 starting in upper left, x in the horizontal direction and y in the vertical direction. (See image).
- A brief guide to using the number scrubber tool to quickly change numbers.
The student will be able to write code like:
Where students struggle
- Students often struggle with getting the syntax exactly right - like leaving off the semi-colon, forgetting to use commas in between parameters. Oh Noes Guy should warn them about their bad syntax, but they may still struggle to see how to fix it.
- Students may misspell function names. Once again, Oh Noes Guy can often suggest a better spelling. They can also look at the documentation below the editor to double-check.
- Students may pass in the wrong number of parameters or forget what the parameters mean. You can encourage them to change the parameters and see how the shape changes in responses. You can also remind them to check the documentation.
- Students may have a hard time understanding the layout of the canvas grid. You can print out a grid paper handout for them to help them visualize it or just have them draw it out on a piece of paper next to them.
Additional materials: Unplugged activities
An "unplugged" activity is one that you can do with students without needing to use a computer at all. They can help convey concepts in a more visceral way, and they can also be a backup activity for when computers fail.
To complement this lesson, the best unplugged activities are the ones that convey the idea of a program as a series of commands. These activities are best done before the students get into coding and are probably better suited for younger students. For a short activity, you can quickly play Robot Game or if you have more time, try Code.org's Graph Paper Programming (Overview Video & Example Teaching Clip).
Additional materials: Discussion questions
These are questions that you can ask students individually after they've done the lesson, or lead a group discussion around, if everyone's gotten to the same point.
- What is surprising about programming?
- What is the hardest part?
- What do you like about it?
- What do you dream about being able to program one day?
Additional materials: Trivia questions
These can be fun to do as a class after everyone’s gotten through the lesson. They can also lead to discussion about which questions are the hardest. Play them on Quizizz.