jQuery’s Resig Helps Khan Academy Teach Computer Science

Six years ago, Khan Academy launched its free educational website, featuring thousands of videos uploaded by users on math, science, finance/economics and the humanities. This month, the not-for-profit expanded its efforts to include computer science.

John Resig, who created jQuery, developed the computer science page on Khan Academy using JavaScript and Processing.js

What’s Under the Hood

Khan Academy’s computer science page is different from the rest of the site in a number of ways. It allows you to do more than just watch educational videos. The computer science page includes the ability to type and edit code in a window and see it run immediately, or watch a video lesson with its audio track synced to the edit and results window.

The computer science page is more about learning programming in JavaScript than pure computer science. However, it does get into such advanced topics as Turing Machines.

Users can also learn about Processing.js functions such as drawing graphics and animation through the user interaction tutorials. The Processing.js functions include a live interactive editor on the left, a canvas area on the right and a video or interactive track. The live code runs automatically and you can comment lines out or alter variables through typing, clicking on a number and dragging the pop-up slider to the right. For color selection, there’s a pop-up selector.

This interactive editor also has a built-in live error checking system that pops up a friendly error message when there’s a hyperlink that is called into question.

In addition to its Processing.js functions, the area is particularly good at documenting each page located under the editor. Click on any of the documentation topic buttons and it populates the editor with a working example of that topic, along with comments in the code on how it’s used.

Computer science videos on Khan Academy are either YouTube-type or interactive demos with a voice over to guides you through a topic. Both types of videos tend to be just a few minutes long.

Users’ work can also be saved and shared via Facebook and email.

Computer Science Q&A – More Growth

Each page of the section has an area for questions, tips and comments. Despite the guidelines on how to comment, there’s a fair bit of off-topic content on the pages I saw and this new section could stand a bit of curating.

The site is an excellent learning vehicle — fun without being too heavy. The use of Processing.js to add graphics is a great idea. There’s a reasonable amount of content (currently 43 single page tutorials) that will no doubt expand with time.

The only thing I can say is missing is how to make the eventual transition from taking what you’ve learned to coding HTML5/JavaScript outside of the environment. I’m guessing that may get included in the future.

Related Links