October 17, 2014

Making a $400 Linux Laptop

At some point, every programmer should learn how to use the Unix command-line.

So I started teaching Piper a bit about how to use a command line shell this week. We installed crouton on her Chromebook, and we used it to look at a couple files and build little shell script. That continuing adventure is a story for another time.

But crouton was the surprise for me. I immediately fell in love it. The Linux-on-chromebook setup was so great that a few days later, I made another one. It's an amazing deal: for about $400, I got a lightweight linux box with 4GB RAM, 128G SSD mostly empty, 8 hours of battery, and a touchscreen! Here is what I bought:

The new C720P with 4GB ram, but the cheap configuration with a 16G SSD

MyDigitalSSD SC2 Super Cache 2 42mm SATA III 6G M.2 NGFF M2 SSD Solid State Drive (128GB)

It was a terrific little project, very easy. The basic idea is to follow the SSD upgrade instructions here

There are only a couple gotchas. One is at the start: you want to begin by burning a recovery image on a USB stick, which should just take a couple minutes. But the instructions above say to use the URL "chrome://imageburner" to make this, and it doesn't actually work on the c720p (it runs, but then it hangs). Instead, go to the Chrome App store and search for the Chromebook Recovery Utility. That will make a recovery image quickly.

Then you're ready to upgrade the disk! Piper and I unscrewed the laptop and followed the instructions here - it was a great chance for us to take a look at all the innards of the computer, and it was a very easy upgrade.

The only other gotcha is that he M2 SSD card doesn't go in either way: there is a "right" and a "left" - one side with four gold connectors and the other side with five. The big brand-name sticker on the new SSD we got was on the opposite side as the old one, which confused us; it just needed to be flipped upside-down, sticker down.

Then we reassembled and rebooted the computer, stuck in the recovery USB drive, and then followed this page's advice on how to enable developer mode. In short: ESC-F3 and Power. Then control-D, and then wait. Apparently converting the huge 128G SSD to developer mode, takes a little while; but there is an ASCII art progress bar at the top of the screen.

Finally, we downloaded crouton from goo.gl/fd3zc, and then we used ctrl-alt-T to bring up a crosh tab; entered shell; then ran the crouton script to install a command-line-only debian.

It's terrifically functional - I used it to build a current build of node.js and some other things. It's not terribly secure, because anybody who can log into the machine can get root access. But for student work, it's great!

Posted by David at 08:27 PM | Comments (0)

October 03, 2014

Teaching About Data

How do you teach beginning programmers about data in the internet age?

  • Teach the kids how to learn on their own: for example, can you find and use technical data sources using Google? Self-teaching is a key hallmark of successful students.
  • Teach using real-world mainstream idioms: Javascript, jQuery, HTML5. This lets kids directly apply code examples from the web. We take advantage of Pencil Code to make this easy.
  • Keep things real: it is more meaningful if we use real data to answer real-world questions!

It is a real pleasure to see students learning to learn independently this way.

Last week I taught a class about data that went very well. It was interesting enough that maybe others might want to try to do the same.

Using Google to find a Technical Article

The class started with an acronym: JSON. A lot of data on the internet is made available using a technology called JSON, so we began by searching Google for code ideas by using the query [Using JSON to get public data]. That query lead us to a few articles, including a blog post by Mark Lee....

Continue reading "Teaching About Data"
Posted by David at 12:54 PM | Comments (3)

July 10, 2014

Code Gym

At the first Google I/O Youth program this year, we used a new open-source website, the Pencil Code Gym, and it was a smashing success!

The website is a place where beginners can create open-ended creative projects in graphics, music, or interactive fiction, all using a little bit of simple code.

It is based on Pencil Code, which means that you program in CoffeeScript with the Pencil Code editor and turtle library. It comes with lots of ideas, hints, and a nice on-line reference. The students who came through to use it had a wide range of backgrounds and knowledge, with many first-time coders and also a few experienced code-jockeys.

The kids were bold and tried every project we had to offer. I was surprised by the musical talent of some of the kids (check out the projects), and I particularly enjoyed working with the deaf kids who attended - some of the deaf kids even did musical projects.

You can see the projects put together by code gym students here, at the Code Gym Stage.

Posted by David at 05:18 PM | Comments (1)

May 23, 2014


Here is musical.js, which is a small (less than 17K minified) javascript library that can translate from ABC notation into WebAudio, for playing simple tunes on any modern browser. It has no dependencies, and it can be used as a plain script, an AMD module, or as a node.js module. It also includes a simple synthesizer for creating your own instrument, including a basic electric piano sound.

The library is really simple to use. Basically, include the script musical.js, and then:

piano = new Instrument('piano');

Then with any WebAudio browser, you will be Baahing with the Black Sheep, Twinkling with the Stars, or singing your ABCs with me. The notation used is called ABC Notation, and it is used for a lot of simple sheet music online.

Less-simple music can be played just as easily. Here are some short examples: Minuet, September, Sonata and Moonlight.

The library comes out of work from beefing up music support in Pencil Code. The WebAudio sequencer in that library has improved enough that it deserves to be a separate library.

You can also play with it as part of the turtle library on pencil code here: that example is a simple interactive piano keyboard where you can see the keys.

Have fun. Let me know if you encounter any problems, or if you have any ideas for improvements. Always looking for open-source contributions.

Posted by David at 03:39 PM | Comments (1)

January 31, 2014

Pencil Code at Worcester Technical High School

I spent a day last week at Worcester Technical High School with all their CS students, using Pencil Code as a teaching tool.

Vocational students are motivated by real-world applications, and the teachers at WTHS are amazing. They bring their entire group of students through four years of rigorous CS classes, ending with AP computer science in their Senior year. "There is a difference," the teachers explain, "between offering CS exposure and teaching mastery. We teach mastery."

For this group of CS-focused students who have been learning Java, ASP.NET, and HTML, Pencil Code is a terrific tool. The instant feedback lets them apply and experiment with difficult concepts quickly. And because it is so open, Pencil Code is lets them assemble concepts from varied areas.

Here are the worksheets we used in Worcester:

Combining Three Languages using HTML
Exploring Recursion with Fractals
Using Subclasses to make Moving Sprites

In all three of these lessons, the turtle is a starting point, but it is just a stepping stone into real-world applications and deeper concepts.

The day was terrific. We found that we taught some unexpected lessons. The teachers pointed out that the indent-based syntax of CoffeeScript (and the instant-error checking in the IDE) connected with several kids for the first time who now could really "get" how scoping works. Some kids never indent their blocks, but with CoffeeScript, they have to! And surprise - once it is indented, they can see clearly how it works.

After the day, the AP students in the group suggested "We should start with Pencil Code!"

I am holding hackathons to build more lessons and materials that take advantage of the Pencil Code environment, and to improve the tool itself based on what we are seeing in classrooms. The first hackathon is on February 14 - sign up at hack.pencilcode.net.

Posted by David at 08:56 AM | Comments (0)

January 19, 2014

A Bad Chrome Bug

The latest version of Chrome has a bad bug that seems specific to the GPU in my (Samsung series 9) laptop. It actually took me a couple days to notice the problem and realize it was Chrome's fault and not the fault of the underlying website.

Here is the bug: when you visit a fast website that has no images (and no javascript-rendered changing content), Chrome does not render anything. It just leaves the page blank. It will render as soon as you scroll or cause something to redraw.

My laptop does not have an exotic configuration - it is a 2012-era windows laptop with a very vanilla Windows 7 setup, so I suspect many people may be affected by the bug.

The funny thing, the bug is something you may not have noticed because almost every webpage we might visit day-to-day contains an image. And pages that do not have images - well, as soon as you scroll, they render, so you might have thought that the webpage was slow and then popped in when you scrolled.

If you use Chrome, try it out on your computer. Does it happen to you? To test, here are a couple links to webpages that have no images. If they render for you, try pressing "refresh" to see if they render once they're cached and fast:



If you see the problem, put in information about your hardware, and vote for the bug to be fixed here:

(Update: found an old issue that appears to have reported the same problem in beta - https://code.google.com/p/chromium/issues/detail?id=325309)

Posted by David at 10:58 AM | Comments (1)

January 09, 2014

PhantomJS and Node.JS

I'm setting up a guide for contributing to PencilCode.

There are now integration tests. In about 20 seconds, the "grunt test" command starts a local development server, starts a headless webkit, and tests most of the core functionality on the website, including browsing users and directories, loading, editing, running, saving, and deleting programs, and using passwords to log in. You get this all for free by just installing node.js and the grunt build tool, and building the source.

The integration tests look like this: edit_code.js - they are low-level but surprisingly clean and quick. The tests are designed to be run by mocha (a command-line javascript test runner), and they depend on node-phantom-simple, which is the lightest-weight headless webkit I could drive from a node.js build environment. The Gruntfile sets up everything. One of the curious things is that the development server actually runs as a proxy server. This allows it to intercept test-browser requests to full DNS names even though it doesn't own the DNS name.

Why Tests are Awesome

The test setup is designed to maximize developer productivity: the default test target runs tests very similar to production, with all the code compiled and minified, but the "devtest" target runs the same tests directly against unminified unoptimized source code, for easier debugging.

The beauty of a good integration test is that the code can now be aggressively changed without fear that the change will break something important. If some change breaks something, we can know in 20 seconds.

Right now my integration tests run quickly, because my test matrix is small. As the test matrix grows larger, many open source projects use jquery-turtle as well; then it will be time to refactor the code so some interesting features can be added.

Posted by David at 07:29 PM | Comments (1)

January 03, 2014

Integration Testing in Node.js

What's the best way to run integration tests on an AJAX-heavy website?

I have been toughening up the pencilcode.net deployment environment. (git repos here.) While the pencilcode server is an nginx webserver backed by a small python-uwsgi app server, the pencilcode development environment is 100% javascript, with a node.js and npm and grunt-based build, and a small express.js test server that proxies backend calls to the production server.

If you think that's just a lot of hipster coder buzwords, wait... there's more.

This morning I broke pencilcode.net due to a code change: while refactoring the editor source code to use proper require.js organization, I messed up by bringing in an old version of seedrandom that wasn't compatible with AMD loading. Seedrandom is my own library, and so it was doubly my own fault! The result was that all password checking was broken on the site for a few hours. The bug took about 10 minutes to fix: I just had to use bowercopy to upgrade seedrandom to its latest bower package, then run the requirejs optimizer, then redeploy.

But the real bug? I don't have any integration tests on pencilcode.net. I should have never pushed broken passwords in the first place. While I have some little unit tests, I really need end-to-end integration tests that bring up the whole website, browse it with a headless browser, and click around authenticating and editing and running and saving, to make sure it all works as expected.

The 2010 way of doing this used to be a big system like Selenium. But it feels like in 2013 I should be able to do this in lighter-weight way. I have seen that grunt-phantomjs works pretty well with QUnit unit tests. But almost all the javascript-based tools I've seen are designed for tiny unit tests.

How do I run tests that exercise the whole system end-to-end? Maybe something like travist's jquery.go.js? Has anybody found the right way to do integration tests in the node.js world?

Posted by David at 06:52 PM | Comments (0)

December 20, 2013

Second Edition of Pencil Code

The best parenting advice: before your children grow up, teach them something. They will remember it forever.

So in that spirit, here is an activity to do with your daughter or son over the holidays: give and play with the second edition of Pencil Code (just released). Teach them how to write little computer programs.

The new edition adds a 20 page appendix with a CoffeeScript tutorial, which is particularly helpful if Mom and Dad do not create software for a living. If you already got the first edition and you wish you had the tutorial, do not worry - get the tutorial on the web here and print it.

While you are playing with Pencil Code, also be sure to look at the extra free materials on guide.pencilcode.net - there are handy printable protractors, reference sheets, activities, and videos. And almost all the material in the book is available online for free. If you do not want to use paper, you can just go to pencilcode.net and play for free.

Still, the book makes a terrific present. Children show their incredible sense of wonder when leafing through a little handbook of examples of magical code, each one illustrated in color. Each page is a map to a little adventure, a puzzle and a discovery waiting to unfold.

The book has more than 100 little programming projects, and they range in depth and ability from 1st grade up to 12th grade. The first page hows how to make a webpage that draws a simple line. The last one shows how to make an artificial intelligence that will beat you at tic-tac-toe. In between, draw a flower, make a game of tag, or draw the Mandelbrot set.

It is a little book crammed with ideas, designed to last for a decade. As long as it is in your house, it is a reminder: there is something much cooler than playing computer games: making your own.

(Also, while you're getting the book - Amazon didn't bring the reviews of the first edition along to the second edition, so leave a nice review!)

Posted by David at 12:22 PM | Comments (0)

December 18, 2013

Learning to Program with CoffeeScript

Is CoffeeScript a good first programming language to learn?


I have written a new tutorial for beginners to learn to program with CoffeeScript.

Like Python, CoffeeScript has a punctuation-light syntax that is easy to type so that beginners can get straight to the essential concepts instead of fiddling with semicolons and matching curly braces. And yet it is a real language used by pros, so you can learn the essential concepts that you will see in other languages: variables, algebraic expressions, control flow, functions, lists, objects, classes, closures, exceptions, and (if you use Iced) even continuations.

The big advantage of learning CoffeeScript over Python is that you can start right now in your browser, without installing anything! Although CoffeeScript doesn't have the same full-featured standard library that Python has, jQuery makes a fine standard library. To help beginners, I have put together jQuery, a turtle graphics plugin jQuery-turtle, and a syntax coloring editor on pencilcode.net.

The tutorial teaches you how to program in CoffeeScript by building a game of hangman from scratch. It takes a couple hours to learn enough programming to make hangman. You will learn about:

  • Memory and naming
  • Computer arithmetic
  • Using functions
  • Simple graphics
  • How to make a program
  • Input and output
  • Loops and choices
  • Delays and synchronization
  • Connecting to the internet

At the end we will have a game we can play.

Here is the tutorial: Learning to Program with CoffeeScript.

Posted by David at 10:30 AM | Comments (0)

December 16, 2013

Teaching Math Through Pencil Code

How young is too young to teach programming?

I have been using Pencil Code with children from 1st grade to 12th grade over the last few weeks. All ages have a lot in common: they all need to learn the same programming concepts at the beginning. Even before learning control flow, they need to understand sequencing, debugging, and how to think about the state of the computer. However, there is one big difference between younger kids and older kids: the younger kids have not yet learned a lot of math fundamentals.

Using Programming to Reinforce Math Curriculum

When a fourth grader asks "what is the command to make the turtle go that way?" it is really a math question. The idea of estimating degrees for a turn seems perfectly concrete to an older student, but if you are a 4th grader, measurement of angles is a new idea that is hard to grasp. The fourth grader wrestling with the turtle's direction is really asking, "how do I measure the angle that I want?"

The problem of getting the turtle to turn the right way is a valuable math teaching moment. Do not give away the answer. Instead, give the student a protractor, and the student will align it with the turtle on the screen and pick out the angle they want.

Pointing the turtle requires an extra level of care beyond math class, because the student will need to note not only the degrees, but also whether they want a "right turn" or "left turn." But once the proper angle is found and the student has entered "rt 60," they they are rewarded with a working program as well as an insight: angle measurements are pretty useful!

When teaching classrooms of fourth graders, I have been using handouts with paper "turtle protractors" that illustrate the turtle in the middle of a compass rose. The printable measurement sheet also includes a "turtle number line" so that younger kids can do the same exercise with linear measurements. These paper supplements are invaluable.

Programming Motivates a Range of Math Curriculum

Computers speak the language of math, so learning to program your computer is a good reason to learn a bit of math.

Math topics that tie directly in with Pencil Code include:

Programming is a good way to learn about to the importance of precision in measurements and the use of numbers to quantify many things. Normally this is hard-won knowledge, gained through years of teachers marking mistakes on math homework. But in programming, the purpose of math is not to get a good score on a test. The purpose of the math is to get your program to work. It is a self-teaching lesson.

Programming Motivates Advanced Concepts

Programming draws kids in to playing with concepts that would normally be considered too abstract and dry for math class.

For example, kids particularly love creating programs that draw circles and curves. However, since arc measurements are (sadly) considered an advanced High School concept, they will not have been covered before most beginning programmers try Pencil Code.

With Pencil Code we have been introducing arcs using an arc-measurement sheet that is similar to the protractor sheet. Kids can hold it up to the screen it to visualize (for example) the fact that the bottom of a "U" is 180 degrees of an arc of a circle. Fourth graders enjoy measuring arcs as part of their programs: arcs make it possible to create beautiful flowers and sports cars and inscriptions.

Perhaps when these Pencil Code fourth graders arrive in high school geometry class years from now, arc measurements will be less of a mystery and more of a "cool" topic.

Posted by David at 03:37 PM | Comments (0)

December 09, 2013

Hour of Code at Lincoln

Lincoln classrooms participating in the Hour of Code 2013.

Today I spent the day at Lincoln public school, helping grade school classes participating in the Hour of Code. We were hosted by teachers Cindy Matthes and Terry Green, who both have a long history of championing technology education for young kids. Terry literally wrote the book on teaching engineering to K-2 kids.

Here are some of the fourth-grade creations - as you can see, at this level, coding is mostly about learning about quantities and careful sequencing.

Several of the fourth grade girls were the natural leaders their Hour of Code classes: they had a ton of ideas of what they wanted to draw. They wanted to know how to get the colors they wanted, how to draw curves, how to draw text, and how to make the turtle wear a different colored shell. There were very few preconceptions about what they could or could not do with a computer at that age, and they were persistent in getting things to work.

The middle-school group was self-selected (and, in an odd contrast with the experience in the fourth grade group, they were mostly boys). They were able to speed through Lesson 1 at event.pencilcode.net in 30 minutes, and we did a bit of Lesson 2 as well. In middle school, there is a pretty broad spectrum of styles - some kids wanted to try small experiments of their own invention, and other kids wanted to type in a complicated ambitious program from the book to see if they could get it to work. The book of 100 example projects was a useful tool for this older group. Continue reading "Hour of Code at Lincoln"

Posted by David at 05:32 PM | Comments (0)

December 08, 2013

Hour of Code at AMSA

Families participating in the AMSA Hour of Code 2013.

Yesterday I participated in a wonderful Hour of Code event at AMSA. The AMSA and Marlboro teachers there are absolutely amazing, dynamic teachers. I brought some new Pencil Code materials and books to use. Within 15 minutes they had things copied and stapled together; they had reviewed the new materials; and they were ready to roll.

Here are the materials we used yesterday.

Attendance was terrific, overflowing the reserved classroom. So they opened up a second classroom and divided kids by level. The higher level kids went through "Lesson 3", which covers topics such as variables, control flow, arrays, randomness, synchronization, and network requests.

The beginner kids started with "Lesson 1", which gets you going with basic sequencing and turtle drawing. At the 30 minute point, they were doing well, so I showed them the video for "Lesson 2", which is a nudge to get you to be thoughtful and creative. Lesson 2 also demonstrates arcs, which are a great tool for students to use to make beautiful things.

A few creations from the rank beginner kids - a lot of understanding in just one hour!

Posted by David at 11:35 PM | Comments (0)

November 28, 2013

A New Book and a Thanksgiving Wish

Here is my new book: Pencil Code, a programming primer for kids. It is available on Amazon.

You can see in the thumbnails that it is a slim book that presents more than 100 short example programs, each one illustrated in color. There is very little text. This is a book for inductive learning: each important concept is illustrated by an example that is short enough to invite experimentation and exploration.

Run programs at pencilcode.net. There you will find an online help system as well as hundreds of other users' projects to explore and copy. Save your own projects on by creating your own subdomain there.

I am publishing the book today because I think it will make a good holiday gift for the daughter or son in your family who is just at the edge of being interested in programming computers. The illustrations are a way to invite a little interest, and the short pieces of code make a good project to sit down and work on together with Mom and Dad or brother or sister. Since there are more than 100 projects, there is a little something for everybody: art, games, puzzles, humor, or simulations.

Of course, you can program in Pencil Code without buying or waiting for the book - the online sandbox is free, open-source, and openly available. Here are a few projects to try:

A square
Drawing a smile
Simple loop
Catalog of polygons
Guess my number
Fractal fern
Fractal trees
Turtle race
Chase game
Orbit (click to move the sun)
Bizarro tic-tac-toe (try to lose)

Programming as an Artistic Pursuit

How did you learn your profession?

When I was growing up, my father brought home an Atari 800 and subscribed our family to COMPUTE! magazine. Like several other computer hobbyist periodicals of the era, every issue of the magazine was chock-full of source code for games, algorithms, and utility software.

The printed programs were magic. I would type these programs, not understanding much of how they worked, and I would be rewarded with an amazing piece of running software. Soon I recruited my Mom to type with me. She didn't understand much about the code either. However, she brought an essential skill to the table: she was a trained typist, and so she could help me enter pages of long mysterious code at more than 30 words per minute!

After days of typing and a lot of painstaking typo-checking, a little bit of computer programming wisdom would leak into our heads. Gems such as how the letter "O" works differently from the number "0" even though they look quite similar, or that the "REM" statement (a comment) doesn't actually do anything.

After typing many games that I didn't comprehend, the first program I actually understood was a 10-line prime number sieve. That kernel of knowledge let me build and modify many mathematical algorithms and graphing programs. Then I went back to steal techniques from the magazines to make my own games. Growing up in the era of printed source code was a formative experience. Freelance code published in a magazine made it obvious that programming was a creative, personal endeavor.

For me, the computer was a blank sheet of paper, and writing programs was an artistic process.

But the year I graduated from high school, the world also graduated from printed source code. In May of 1988, COMPUTE! announced that they would no longer print source code in their magazine. Their justification: "As computers and software have become more powerful... we also realize that you're less inclined to type those programs." So by the summer of 1988, the code was gone, and it was replaced by "a complete buyer's guide in each issue to help you find, and then buy, the right software for your computer."

The world had changed. Before that moment, programs were manifestations of personal creativity, distilled cleverness in the same way that poems or symphonies are specialized creative forms. After 1988, programs became industrial products, produced by highly trained professionals working in teams cordoned behind secure gates, and distributed to the public as sealed, shrink-wrapped products.

A Return to 1988

Today there are two trends that make it important to return to the 1988 ethic of personal programming.

First, the economy has been profoundly transformed by the impact of software. There are no corners of commerce - from farming to medicine to manufacturing to retail to trade to finance to war - that have not been fundamentally restructured around the analytical and organizational power of automation. Software infuses everything. While in 1990 we imagined that it was important for the "Knowledge Worker" to be able to be creative with software, in 2013, it is becoming clear that almost all workers must spend some of their time being "Knowledge Workers."

So we cannot teach this generation of children to be afraid of writing programs. They must understand that code is an approachable tool - that it can be used, like a pencil, to do both utterly simple things as well as blindingly complicated things. Tomorrow's adults must have an intuition for how software is created, how it can work well, how it fails, and what role it should play. And they must know that, ultimately, they are capable of creating software. Whether they write a spreadsheet macro to fact-check a statistic, or whether they create an elaborate storefront app to automate their business, tomorrow's workers must be literate in code just as 20th century Americans learned English literacy. Computer code is becoming an essential tool for understanding, cooperation, and commerce.

The Rise of Pseudocode

The second trend is that computers have become faster than they need to be, and that is making them easier to program. In the old COMPUTE! magazines, the experts of the day proudly announced a highly tweaked assembly-language sorting program that was "Capable of sorting 1000 items in 2.1 minutes." (That is a millisecond operation for a mobile phone today.) With slow computers, programs needed to be absolutely optimized for the computer, even if that meant the code was incomprehensible to humans.

Today's computers are so fast that we must make the opposite choice. Most computers spend most of their CPU clock cycles idle, waiting for the user to decide what they want to click next. So when optimizing a system, the right design is to spend as much computer effort as possible to simplify and speed things up for the person. In particular that means that programming languages must be designed to be easy for people to read and write, even at the cost of making programs more difficult for computers to run.

Modern scripting languages such as Python, Ruby, Javascript, and CoffeeScript are all converging on a very similar idiom which in the 1980's we would have called "Pseudocode". These languages look like the chicken scratch that a person would naturally write if using a pencil to describe an algorithm to another person. These languages are readable because they delegate many of the details to the computer. To run a program written in a modern scripting language, the computer must deal with details such as type checking, memory allocation, compilation, and optimization. The programmer is free from these minutiae, and can focus on the underlying concepts.

A Holiday Activity

My hope, in working on Pencil Code, is to do a little bit to help bring these two trends together. Children should learn how to write programs. It is good for the world, and it is good for their personal education. But they should learn how to do it with authentic tools - the same ones used by professionals. Pencil Code helps you program in CoffeeScript. Modern languages like CoffeeScript make it easy to program, and they empower the programmer to do interesting things in the real world. And they let you see through straight though to the real concepts without getting hung up in the boilerplate details.

My wish is that, during the holidays, you will find a moment to play with Pencil Code together with somebody, and open their eyes to the world of coding as a personal and creative endeavor.

Happy Thanksgiving.

Upvote on Reddit.

Posted by David at 01:09 AM | Comments (4)

November 09, 2013

Pencil Code: Lesson on Angles

Here is a lesson on Angles using Pencil Code. It talks about why a triangle can be made with 120 degree angles. Using concrete turtle programs, it teaches the mathematical concepts of exterior and interior angle, arcs, and regular polygons. And it provides a hint for exploring curves with winding number larger than zero.

No written companion materials yet, but when they are ready, I will update this blog post.

Posted by David at 10:58 PM | Comments (0)

November 05, 2013

Pencil Code: Lesson on Lines

Here is a first lesson on Lines using Pencil Code. It shows how to use functions by introducing five commands that can be used to create drawings by moving a turtle. It shows how to test functions and build them into a program, and it shows how to save them on your own website. It is about five minutes long.

You can teach by just showing the video, or by using the video for ideas on what to talk about in your class.

When teaching this material, expect it to take about an hour for first-time programmers to understand how to create a program and to create two or three of their own programs. Be sure to encourage students to draw out a plan ahead of time. Have them put in the effort to create a program that accurately follows their written plan. A sheet of graph paper can help.

Rachel Nicoll put together a terrific worksheet to hand out to kids that guides them through a few exercises. There is also an outline for teachers and a reference page to print out that you can use as a handy one-page guide.

Posted by David at 07:32 AM | Comments (1)

October 20, 2013

Pencil Code: a First Look

Pencil Code is the new name of my learn-to-program website.

Piper helped me record a new video about Pencil Code. My plan is to follow up with a bunch more videos on specific topics - this one is an overview.

Posted by David at 10:18 AM | Comments (0)

October 01, 2013

CoffeeScript Syntax for Kids

CoffeeScript, with its highly intuitive syntax, has been a hit in the classroom. It is a language that largely gets out of your way. It works the way you expect it to. However, there are still some pitfalls. Here are some findings from looking at CoffeeScript programs written over a couple months in a school, and with my kids:

  1. Iced Coffeescript is helpful. In modern single-threaded code, all communication - including user input - is inherently asynchronous, involving callbacks. But it is a heavy lift to learn callbacks: for example, simple loops become complex recursions. The "await/defer" in Iced fixes this by allowing you to "block" a program without buying the full complexity of preemptive threads.
  2. But the syntax of await/defer makes it hard to learn. Ideally, one could use "await" before understanding the concept of "defer". Whereas waiting for an event is easy to understand, the concept of passing a continuation function is difficult. Defer should be implicit when there is no variable being received.
  3. The "for" loop is too hard as the first loop, because it requires the concept of a loop variable to have any sort of loop. It should be possible for kids to make a loop without knowing what a variable is. LOGO's "repeat" would be perfect.
  4. Allowing the "=" as an expression leads to confusion. It is really common for beginners to write "if a = b" and not notice the problem. This is a language design flaw that is shared by C/C++, perl, and Javascript. Python fixes it by making single-equals assignments illegal as expresions, and nobody complains about it. Coffeescript already has several ways of spelling the same concept; my recommendation would be to have a separate ":=" operator to use as assignment-within-expressions.

I've started to hack on a light CoffeeScript fork to address these issues, but I'm not sure it's a good idea. There are advantages to teaching "vanilla Iced CoffeeScript" instead of a custom language.

Posted by David at 05:27 AM | Comments (0)

March 2015
Sun Mon Tue Wed Thu Fri Sat
1 2 3 4 5 6 7
8 9 10 11 12 13 14
15 16 17 18 19 20 21
22 23 24 25 26 27 28
29 30 31

Recent Entries
Making a $400 Linux Laptop
Teaching About Data
Code Gym
Pencil Code at Worcester Technical High School
A Bad Chrome Bug
PhantomJS and Node.JS
Integration Testing in Node.js
Second Edition of Pencil Code
Learning to Program with CoffeeScript
Teaching Math Through Pencil Code
Hour of Code at Lincoln
Hour of Code at AMSA
A New Book and a Thanksgiving Wish
Pencil Code: Lesson on Angles
Pencil Code: Lesson on Lines
Pencil Code: a First Look
CoffeeScript Syntax for Kids
CSS Color Names
For Versus Repeat
Book Sample Page
Teaching Programming and Defending the Middle Class
TurtleBits at Beaver Country Day
Book Writing Progress
Lessons from Kids
Await and Defer
Ticks, Animation, and Queueing in TurtleBits
Using the TurtleBits Editor
Starting with Turtlebits
Turtle Bits
No Threshold, No Limit
Local Variable Debugging with see.js
Mapping the Earth with Complex Numbers
Conformal Map Viewer
Jobs in 1983
The Problem With China
Omega Improved
Made In America Again
Avoiding Selectors for Beginners
Turtle Graphics Fern with jQuery
Learning To Program with jQuery
Python Templating with @stringfunction
PUT and DELETE in call.jsonlib.com
Party like it's 1789
Using goo.gl with jsonlib
Simple Cross-Domain Javascript HTTP with call.jsonlib.com
Dabbler Under Version Control
Snowpocalypse Hits Boston
Heidi's Sudoku Hintpad
Social Responsibility in Tech
The First Permanent Language
A New Framework For Finance
Box2D Web
Lincoln School Construction
Stuck Pixel Utility
Fixing the Deficit
Cancelled Discover Card
Tic Toe Tac
Toe Tac Tic
Tutorial: Root Finder
Wiki Javascript at dabbler.org
What SAT Stands For
Computer Club
Tutorial: Cannon Game
Tutorial: Pascal's Triangle
Tutorial: Custom Poem
Tutorial: Concentration
Tutorial: Histogram
Tutorial: Maze Maker
Tutorial: Tic Tac Toe
Tutorial: Mastermind
Tutorial: Polygon Drawing
Tutorial: Caesar Cipher
Tutorial: Guess My Number
Tutorial: Ten Followers
Tutorial: Fifteen Puzzle
Handheld Glasses-Free 3D
Making a Time Machine
The Next Grand Deception
There is Brilliance in this Language
Minimum Hint Sudoku Hunt
Collected Hacks
Python pi.py Spigot
The Mystery of 355/113
It's Not About The Answer
Solid Geometry
Teaching is Hard
A Mathematical Notation Question
Second Coming of Wyden-Bennett?
Reading JQuery Sources
Random Seeds, Coded Hints, and Quintillions
Xinhua: We Report, You Decide
My God, What Have We Done?
Campaign Calls
Ballmer Favors Torture for Lawyers
Flawed Security
Older Writing