中学生にプログラミングを教えてみて。その1


プログラミングを教えるにあたって、言語をJavaScriptにした。


とりあえず、中学生らを集めてどんなアプリを作ってみたいか?と質問すると、

大半がゲームであとは自動○○の辞書的なものが多い。


どちらも数ヶ月の教室で作れる代物ではない。


だけど、

その出だしだけでも触れて欲しいとJavaScriptのcanvasでどこまで出来るか調べることにした。

※canvasはブラウザでアニメーションやゲームを作ったりできる要素


そもそも普段の開発でcanvasを使うことなんてほぼない。


ということで、

自身がcanvasに慣れることから始めた。



ボールや流星がcanvasの練習にとって良いとどこかで見たので、

流星のアニメーションとかボールのバウンドを作ってみて、ここまで到達するのに何が必要か?を挙げてみたところ、


・適宜、自作、もしくは用意されている関数(メソッド)が使用できること

・オブジェクトが関数(メソッド)を持っていることをイメージできること

・配列という複数のデータを一度に持つデータ構造があること

この3点が必須であり、山場だと感じた。


1つ目と2つ目のメソッド関連の話というのが、

ctx = document.querySelector("#canvas").getContext("2d");

で、CanvasAPIで用意されている機能がctx変数に突っ込んだオブジェクトにあるよということ。

練りに練られた機能は先代の偉人達からの贈り物として使えること


3つ目のデータ構造はそのままで、

配列とオブジェクトを組み合わせると様々な値を規則的に持つことができるよ

ということ


この3つのことは言語の入門書によくあるおまじないみたいなもの

という表現で話すのは絶対にやりたくなかったので、

どうすれば退屈せずに習得できるかをよく考えた。

(今でも最善策を考え中)


練習として簡単な計算機→名簿→タイピングソフトの順でコードに触れながら慣れる

ということを主題として話をはじめました。