授業の進捗と課題
ウェブの世界には、面白い小噺がたくさんあります。
雨宿りとWEBの小噺、パーソナリティーのkeethです。
今日も一つ、興味深いお話をご紹介します。
はい、今回の話題は前回に引き続き、
私が副業でやっているプログラミングの講師業の
振り返りというか、最近感じていることについて
頭の整理をしながらお話ししていこうかなと思っております。
タイトル見た方はわかると思いますけど、こちらは後編となりますので、
もしまだ前編聞いていない方は、ぜひぜひ聞いていただけると嬉しいなと思います。
もし聞いたことない方で、先に後編だけ聞きたいという方のために、
一応ダイジェストで前編どんな話をしたかというと、
今回、今年ですかね、というか。
まず、どこで僕がプログラミングの講師業をやっているかという、
その学校の名前と今年のやる内容の
すり合わせをして、で、カリキュラムを決めましたと。
で、そのカリキュラムの内容をザザッとお話ししています。
前期12本、後期13本ですね。
どんな講義をするのかっていうのをお伝えして、
あとクラス構成ですね。
1クラス20人、ないし30人ぐらいの学生さんが参加されまして、
それぞれ、Aクラス、Bクラス、Cクラスってクラス分けされてます。
で、毎週1コマが50分の講義プラス10分の休憩。
で、2コマずつやるので、毎週、要はざっくり6時間ぐらい、
授業でプログラミング講師をしていると。
で、今年やっているのはリアクトとタイプスクリプトの講義なんですけど、
そこで感じたことっていうところ、いくつか喋りながらやっていきますが、
1つ目、Aクラス、Bクラス、Cクラスって分けられてて、
Aクラスが一応プログラミングがまだできる方の学生さんだっていうふうな話を前回もしてまして、
Bクラス、Cクラスとなるほど全然慣れてない方の方が多いと。
だったんですけど、今はハンズオン形式でポケモンサーチアプリっていうものを作ってます。
それはポケモンAPIというパブリックAPIを利用して、
データを取得して、後でカードっぽいコンポーネントを自作して、
そこにデータを表示するというシンプルなアプリケーションを今作っているんですけど、
それの進捗、一番早いのはまさかのCクラスだったんですよ。
レベル低いと言っているのは、学校のスタッフの方がそういうふうにおっしゃっていて、
実際体験した感じ、そうかもしれないと思ったんですけど、
僕からするとそんなに大差ない、Aクラス、Bクラス、Cクラス。
どっちかというとBクラスが一番、レベルが低いというとちょっと語弊がある言い方になっちゃうので、
一番フロントエンドに慣れてない、もしくは開発経験が一番薄いんじゃないかなっていうのは、
個人的にはBクラスの人たちの印象が強かったです。
本当に堂々と、私パソコンすら慣れてないので、
何かエラーが出たら先生が直してよっていうのを言ってくる学生さんもいて、
ぶっちゃけ言うと、そんなこと言うんだったら、この講義受けずに、
何か本読みながらやるとか、言うでみやるとか、やれば良くないって話ですね。
僕が直して、僕がエラー対応しても、その人の学びになりません。
あとは、資料がまだ不完全だったりしてて、資料共有してるんですけど、
その資料通り手を浮かしてて、僕が手元でやっているハンドゾーンで、
一緒にその手を浮かすみたいなことをせずやっているので、
クラス全体としてどこまで進んだかっていうのを全然聞いてない学生さんもいらっしゃるんですよ。
そうすると、その学生さんは今どこまで来ましたとかを言われても、
それをもう一回ここで説明してくださいとか、
自分はどこまで行ったかっていうのをその場で同期的に確認をしたいと。
私はでもクラス二、三十人を見ているので、その学生一人に付き気になることはやっぱりできない。
その学生さんは自分が追いついてないので、じゃあもう私は行きませんみたいな態度を取る学生さんもいらっしゃって、
この辺結構難しいなっていうのがそのBクラスです。
タイピングスピードと学習効果
Cクラスはある意味で一番早いって言った理由は、
たぶん聞いたことをそのまま社境しているからですね。
あとですね、タイピングがCクラスが一番早い気がしてます。
はい、これ結構大事というか、
プログラミングの学習において、特にハンズオン形式の学習の場においては、
タイピングが遅い人たちってやっぱり僕のスピードに全然ついてこれない。
僕も結構ギアとかトルクは落としてタイピングをしてるんですよ。
それでも今エディターがやはりいろいろな補完機能がついていたり、
今カーソル使ってますけど、モデルはちなみにクロードを使ってます。
ほとんど僕がコードを書いてるように見えて、結構タブを打つことになってしまう。
あまりにもそれがやりすぎると早すぎたりするので、
実はですね、AIによる補完を切ってるんですよ。
するとエディター本来持っているその補完機能というのは生きてて、
それは全然使っていこうと思ってます。
それをすることで他の学生さんたちも、
そのエディターそのものをフルに使いこなして、
自分のプログラミングするときのそこの高速化っていうのもセットでやってもらったり、
そういう技術を盗んでもらえばいいなと思っていて、そこはやってます。
それでもCクラスが一番早くて、ほとんどすっかかるところなかったんじゃないですかね。
途中質問された時ありますけど、タイプミスが多かったりしました。
タイプミスするともちろん動かなかったりすることが多くて、
アプリケーションに何かエラーが発生してしまいます。
そのエラーもブラウザのコンソール開いてみれば出てくるわけですね。
あとはタイピングが一部ちょっと僕が早すぎた時とかあって、
追いつかないのでちょっとソースコード戻ってくださいぐらいな発言はあったりしますけど、
Cクラスが一番早いのは多分そういうとこですね。
素直に僕とやってることをほぼ同じことを手を貸してやっているから早い。
ただそうすると一番身になっている、しっかりリアクトとかジャバスクリプト、タイプスクリプトのことを理解できている学生さんは、
果たしてCクラスに多いのかというと、そこはちょっと今測りかねています。
それでいくと多分Aクラスが一番理解度高いんじゃないかなって気はしてますね。
突っ込んだ質問してくるのはやはりAクラスです。
一回教えてくれる人と同じように動かして、ちゃんとものが作れましたとか、
こうやって書けばいいんだっていうその一つの例を一緒に体験をするだけでも、
学習にはなると思うんですけど。
そこで自分の頭を使う、どういうことなんだとか。
授業では私と一緒にやってますけど、
プライベートの方でまた一から自分で同じことできるかみたいなことを考える学生さんとかは、
やはりレベルが上がりやすい、成長しやすいなというふうに思っております。
なるべくBクラス、Cクラスの学生さんも引き上げたいと思ってますけど、
全員引き上げることはさすがに私だってこれは厳しいっていうのは理解してるので、そこは諦めようと思ってますけど。
とにかく進捗で早いのはCクラスっていうのは面白かったなと、一番僕の予想外なポイントはそこでした。
コマンドの理解とエディターの活用
続いてですね、全クラス共通だったんですけど、
一応プログラミングそのものが全くの初心者ではなく、
多少他の言語もやったことある学生さんが比較的多いはずだったんですけど、
例えばPythonとかってバックエンド言語をやったことがあるっていう学生さんはいたんですね。
とはいえバックエンド言語をやっているんであれば、
CLIとかターミナル系でLinuxコマンドとかを叩いたことある学生さんも多いと思ったんですけど、
意外とそうではないなと思いました。
叩いたことはあったとしても、コマンドそのものにまず慣れていないなと思ったので、
意外と言語ができることよりもそういうアプリケーション開発じゃないところでつまづきポイントをしょっちゅうやるんですけど、
そこの慣れがやはり初級か中級者かの分かれ目なのかなというふうには改めて感じました。
なのでなるべく僕もコマンドを叩いてやってますけど、
コマンド叩くときはですね、皆さんデフォルトのターミナルを使っていて、
私はちなみにITermを使ってます。
他にもいろんなターミナル試したんですけど、結局ITermが一番僕としては相性良くて戻ってきちゃいました。
他の学生さんは皆さんMacに標準でついているターミナルを使ったりしてて。
またCDコマンドとかですかね。
あれはチェンジディレクトリで、ディレクトリを移動しますっていうだけの話なんですけど、
それすらやっぱり理解をしなくて、とりあえずCDを叩けばいける。
で、以前叩いたコマンドをもう1回同じコマンドを叩くことってあるんですけど、
僕らなんて履歴に残っているから、少なくと上をターミナル上で押していけば、
履歴戻って過去のコマンドが出てきたらそれをもう一回叩けばいいみたいなことは分かっている。
ですけど学生さんは逐一同じコマンドをまた新しくひとつひとつ丁寧に入力をしていくんですよ。
いやー、この辺からまだ慣れてないなっていうのがすごく感じられるなと思いました。
続いてですね、フロントエンドのプログラミングの授業ですので、
エディターはですね、やはりVSコードを使うかカーソルを使ってます。
どちらでも構わないんですけど。
エディターがいいものを使っていても、やはりそれを自分なりにカスタマイズしたりとか、
それをもっとより良くするみたいな発想って、
まだまだ、初学者の方って至らないんだなっていうふうに強く感じましたね。
学生さんが躓いたりしたとか、自分が書いてるコード見てくださいっていうふうに拝見するんですが、
まあインデント揃わなすぎるのと、
開業もバラバラだったり、スペース全然作らなかったりするし、
よく皆さんこれでコード読めるなと思ったりします。僕は全然読みづらかった。
とりあえず皆さんにプレッターを入れさせました。
自動コード成形してくれるフォーマッタープレッターですね。
っていうのを入れて、エディター上でフォーマット音声部のチェックを入れて、
デフォルトフォーマッターをとりあえずプレッターにするようにしました。
これでだいぶ皆さん、他の学生さんも、
コードが成形されるようになって見やすくなっただろうと信じたい。
同じ手順をやってくださっている学生さんはってことですね。
初学者の慣れない部分
まあそりゃあそんな過読性悪いスペースとかも全然入れなかったりするようなコードを書けば、
それは自分が今どこを編集したりとか、分かりづらくなると思うんでね。
そりゃあそうでしょうって思いつつ、
そこに至らないんだなっていうのもドツ感じましたね。
まあそうしてフレームワークをいくらでも使いこなせますっていうのも、
それは強い条件の一つに入るでしょうけど、
そうではないところの勝手というか、
慣れみたいなところがまだまだ、
小学生の方っていうのはできてないんだなっていうのは強く感じましたね。
これは、やはりAクラスからCクラス全部同じですね。
慣れてない学生さんが圧倒的に多い。
あとですね、ターミナルとちょっと似てるというか、
たまに関連することとして、
ここにファイルを作ってくださいとか、ここにディレクトリを作ってくださいっていうのを、
ちゃんとディレクトリ構造も資料に書いておいたりとか、
自分でもここの中に作りますよっていうのを、
自分の手元を映しながらやってるんですけど、
それをやってもですね、なんか違うところにディレクトリ切ったりとか、
ファイルを作ったりとかしてくるんですよ。
やはりこれも慣れてない学生さんは、
ディレクトリの指定を間違ってて、
ノードモジュールの下にコンポーネントディレクトリを作ったりとかしてて、
エラーへの反応
今作ってるアプリケーションって先ほど言いました、
ポケモンの検索アプリを作ってるんですけど、
その1個前には、まずはフロントエンドの、
ちょっと古典的なアプリケーションにはなっちゃうかもしれないし、
書き方もそうですけど、まずは一回慣れていただこうというので、
Snow JavaScriptとCSSとHTMLで、
今年のカウントダウンアプリっていうのを一緒にハンズオンで作っておりました。
そのアプリを作った時って、
Snow JavaScriptとHTMLとCSSなので、
特にHTTPサーバーをこちらで用意しなきゃいけなかったので、
僕は一旦ライブサーバーを使うようにしました。
皆さんもエディターの中に入れていただいて、
ライブサーバーを起動すると、ポート番号5500で起動しますと。
それはOKなんですけど、
次今作ってポケモンサーチアプリって、
Beatのリアクトタイプスクリプトボイラープレートを使っております。
そうすると、起動の仕方って
npm run devをする必要があるんですけど、
学生さんは前回までの起動の仕方を覚えているので、
今のアプリケーションってそのBeatのプロジェクトなんですけど、
ライブサーバーを起動して、
アプリがうまく起動しませんとか、
画面がうまく表示されませんとか、エラー出てますみたいなことを言われるんですね。
その起動の仕方もやっぱり授業の前で言ってるんですけど、
それでも皆さん失敗したりとか、
npm run devってその授業の開始の時に一発しか叩かないので、
忘れていることも多いんですよね。
前回まで書いたアプリケーションを
もう一回エディターで開いて、それを起動しておいてくださいと言うと、
皆さんわかりません、おっしゃる。
どのコマンド叩けばいいんですか?というのも言ってて、
それはnpm run devですよっていう話をしてますけど、
npm run devと言っても口頭で言っちゃうと、
コマンド皆さん全然叩けないので、
runの方もですね、
runって僕ら当たり前ですけど走らせるっていう意味のrun、
しかもrunのスペルすらわかってないのでranを書いたりとか、
devもdevなんですけど、
このスペルが全然間違っていたりしまして、
アプリケーションを起動するだけなのに、
割と時間食われたりするんですよ。
でも初学者ってそういうところで確かにつまずいくんだなっていうの、
自分もそうだったかもしれないなと思いますので、
根気強く今教えてるんですけど、
起動の仕方も資料に書いてはあるんですけど、
そういうとこだけは見なくて、
リアクトのコードのところだけちゃんと社境したりとかしてるので、
なんとも言えないなっていうところはあります。
最後、全クラス共通で一番思うのは、
やっぱりですね、初学者の人ってエラーのメッセージ読まないんですよね。
どういうエラーが起きてますって聞くと、
なんか画面が真っ白になります。
それはわかりました。
でもそれで何かエラーとかコンソールに出てませんかって聞くと、
コンソールってまず何ですかっていうツッコミから入って、
それはですね、ブラウザで開発者ツールみたいなのがあって、
そのブラウザのタブの中にコンソールっていうのがあるので、
いわゆるブラウザコンソールっていうのを開いてください。
開き方は皆さんMac使ってるので、
コマンドシフトiを押すか、
検証とかっていうのがあるので、
それを押していくと開発者ツールが見えますみたいなことも言ってるんですよ。
やっぱりフロントエンドの開発に慣れてないっていうとそうなっちゃうというよりも、
そもそもブラウザそのものの扱いを慣れてないなと思いました。
大変ですよね。
いろんな知識使わなきゃいけないし、
つまづきポイントがやっぱり初学者になればなるほど、
全然予想次第というか、
僕らだと当たり前にもう通れる道なのに、
やっぱりエラーメッセージを読むっていうのを改めて痛感してますね。
エラーメッセージを読むのはやっぱりプログラミングの
一つの登竜門というか、
これ突破するだけで、この習慣が身につくだけで、
意外と中級者に一気に引き上がると思っているんですよね。
ちゃんとコンピューターとか、
言語がエラーだって入ってくれてて、
そのエラーメッセージを元にコンピューターと対話をすることで、
問題解決ができるようになる話なので、
でもこれはなかなか難しいし、
そもそも英文なので皆さん読みたくないっていう人もいらっしゃるんですよね。
とはいえ、ちゃんと書いてあるのでそれを見ましょうと。
今のところ一番課題なのは、
アプリケーション開発の課題
アプリケーションを皆さんは自分で多分作れないなっていうのはまだ感じてます。
今ずっと僕が見せているから、
同じようにやれば作れるだけだと思っていて、
あとは共有している資料があって、
それはなるべくステップバイステップで、
そのまま社協すれば同じアプリが作れるような構成で書いてます。
それは後から、
アンゾーンの時とか授業中だと追いつかなかったり、
自分で書いたコードと私のコードで若干差異があったりする。
っていうのは後から見返せるようにしている。
ですので、そういうステップバイステップの構成にしたんですけど、
それを全く同じように社協して作っている学生さんもいらっしゃる。
なのでそれがもしないときに、
自分でどうやって作るのとか、
状態管理はどこでやるとか、
コンポーネントのディレクトリってどうやって扱うとか、
別にディレクトリ切らなくて、全部同じファイルでいいと思いますけど、
そもそもコンポーネントファイルを作って、
それをどうやってメインとなるApp.tsxでインポートするのか、
みたいなところも、
授業では全部やっていますけど、
それを新しく自分だけで作ってやってみろってなったとき、
皆さんがどれだけできるかっていうところが一つの疑問だと思っていて、
それを前半の授業で確認したいんですね。
それはもちろん、ものすごい簡単なアプリケーションにしようと思っています。
それがToDoアプリですね。
皆さん一度は通ったと思います。
シンプルなToDoアプリをちょっとSPAっぽくしたくて、
未完了のタスクと完了のタスクっていうのをしっかり分けよう。
なおかつ、個別の削除とチェックついているやつ、
まとめて一括削除するみたいな機能も付け加えられた
ToDoアプリケーションですね。
ToDoアプリのヘッドのところには、
ToDoを追加するためのフォームとサブミットボタンが配置されていて、
それを押すとデータが投げられて、
ToDoのリストを表示するみたいな感じです。
慣れた人、30分で作れると本当に思っています。
なおかつ、最近はAIがあるので、
学生さんにも最後はそれを、
自分でハンズオンじゃなく、
独学で調べたりなんかして作ってくれっていう風に言おうと思っています。
それの出来によって評価をしようかなと思っています。
作れるときは、
別にAIを使っちゃダメですよとは言わないようにしようと思っています。
使ってもいいけど、
明らかに今までとレベルが違うコードを出してきたのであれば、
そういう評価を私はしますよっていうのを、
それは伝えようかなと思っています。
別にAIを使っちゃダメって縛りたくはないんですけど、
身についたかどうかは、
結局は最終的に自分でごにょる必要があると思っています。
AIが僕が指定したUIと仕様で、
そのまんま綺麗に書いてくるとは思っていないんですね。
やっぱりそのプロンプトに気をつけて、
綺麗なコードを書いてくる可能性はゼロではない。
そうなったら、
学生さんはむしろプロンプトをしっかり使いこなせているというところで、
ある意味で、
できる方に入ってくると思うんですよ。
ただ、結局理解しないと、
全部AIどのみになってしまうので、
プログラマーとしては正直言うと仕事はどうやら採用しないだろうなと思っています。
うまいことを自分で作らせるという課題は、
結構評価もしやすくなって面白いと思っているので、
そういうことをやって、
リアクトのコンポーネント分けだったりSPAだったりとか、
リアクトフックスの使い方だったりとかいうのを、
皆さんが理解していますかというのを、
いろんなことをしゃべりましたし、
ちょっと長くなってきたので、ぼちぼち終わろうと思いますけど、
要は、まだまだ初学者のつまずき方は変わっていなくて、
プログラミング教育の観察
ツールがたくさんあったり、AIがいっぱいあるとしても、
同じようにつまづいて、
AIに聞いたら理解できるんでしょうけど、
AIを使っているふうにはまだまだ見えていないので、
もったいないなと思ったりしています。
使っている学生さんも結構いらっしゃいましたね。
見ながら同じハンズオンを自分でやってもらっている学生さんもいらっしゃいます。
ただその学生さんたちがリアクトとかタイプスクリプト、
JavaScriptを理解しているかというのはよっぽど大事なので、
そこを一旦前期の最後の方の授業で、
確認しようかなと思っていました。
以上です。
プログラミングの講師を今後やってみたいという方とか、
今やってるけど学生さんのつまずきポイントはこういうところですよという、
ナレッジシェアでした。
子どもを持たれている親御さんの中で、
子どもにプログラミングをやらせたいという方がいらっしゃいましたら、
子どもは多分こういうところでつまずきますよということを
先にお伝えしておきます。
本当に子どもだとまた違うつまずき方かもしれないですね。
僕が見ているのは19歳20歳以上、何なら一名社会人で普通に子どももいらっしゃる方も、
今プログラミングの世界に
仕事そのものを変えてやっていきたいという方も
いらっしゃったりするのでね。
色が違うというか対象者が違うかもしれないので
つまずき方も違うかもしれないですけど、
でも一度は通る道を皆さん絶対来ると思っていて、
そこは年齢変わらないと思っているんですよ。
いやー後半、まだ前半も終わってないんですけど、
後期、本当に何しようかなとか、
多分まだリアクトタイプスクリプトに慣れていないので、
それの続きもどんどんやっていきたいけど、
子どもはずっとハンズオンでやり続けてもやっぱりリアクトの勉強にならないので、
どっか座学はやっぱりやらなきゃいけないなというのは感じています。
面白くない時間になっちゃうんですけど。
理解しないと自分で使いこなせたりできないので、
書いて一緒にやって慣れる人であれば全然いいんですけど、
おそらく僕の見ている感じだとそうではないのでね。
やはり最後は自分でやらせてレビューをしたりとか、
このサイクルを回さなきゃいけないんだろうなという感じですね。
ツールがどこまで行ってもやはり教育的な本質は変わらないし、
やり続けないといけないので、
やはりツールがどこまで行ってもやはり教育的な本質は変わらないし、
やり方とか見るべきポイントというのも変わってないなという感じがしたよというお話でした。
はい、じゃあ今日はこんなところで長くなってきましたので、
学生との関係構築
終わりにしたいと思います。
それではエンディングです。
いかがだったでしょうか?
一つのNイコル1のお話ですけどね。
私が見ているプログラミングの授業でのお話ですけど、
何でもいいです。言語一つでもしっかりちゃんとやったら、
1個でもやったことでエンジニアとしてのレベルは一気に引き上がると思いますので、
学生さんには頑張ってほしいと思いますけど、
なんだかんだですね、
時間が経つにつれて、
どんどん来なくなるんですよ。人数減ってくるんですよね。
これは毎年恒例ですし、毎年変わらないことで、
それは多分僕の教え方がそうだからっていうのはあると思います。
もうついていけないなとか、そのスピード感でやっていくんだったら、
私は無理だって思っちゃうんだと思います。
ただ私結構落としてるんですよ、ほんまに。
それでも早いって言うんだったら、そもそもプログラミングの前に
コンピューターとかパソコンに慣れてくださいっていう態度を
ちょっと取りたいなと思ったりしてますし、
現代はそれだけツールが進化してきて、
開発スピードっていうのはどんどん上がってきている。
それぐらい便利な世界になってきているので、
そのツールにも慣れてくださいっていうマインドの下やってたりします。
1人、めちゃくちゃ遅い学生さんいらっしゃるんですけど、
それでも彼はずーっと僕に質問したおしてきてて、
スピード追いついてないけど、それでも何とか追いつけるように
今日はどこまで来ましたとか、今どこまで行ってますとか、
僕は何が足りないですかっていうのを、
ちくちく聞いてくる学生さんがいらっしゃいます。
そういう粘り強い学生さんも結局たぶん伸びるだろうなと思ったりしてますね。
しつこいですけど、プログラミングの世界って
僕の大好きな格言、「習うより慣れろ!」だと思ってます。
やったものしか身につかないし、
身についたものだけが君の実力だっていうところだと思うので、
皆さん頑張ってほしいなと思ってます。
教えるっていうのはやっぱり、僕自身が学びになったり、
今のリアクトってどうなんだっけっていう再学習とか、
情報キャッチアップのいい機会だったりするので、
お互いに学び合う関係が環境としてはできているので、
何とかそれをいいものにして皆さんが何か持って帰ったり、
身についたってはっきり言ってもらえるような授業に
僕も頑張ってしていきたいと思いますのでね。
また何か思うところとか、また新しい発見をして、
これはオートキャストネタになるぞって時は
お話しようかなと思っております。
あと、実際に僕にプログラミング教わりたい方とか
いらっしゃいましたら、
ただ僕も別にレベル全然高いわけではないです。
本当中級者に気が生えたぐらいですね。
ちゃんと前線でフロントエンドの開発をやっている
エンジニアには登校及ばないので、
サポートすることもできたりするので、
もし興味とか相談ある方はお声掛けください。
終わっていこうと思います。クロージングです。
この番組面白かったよという方は是非チャンネル登録もお願いします。
もし聞いていて気になることや話して欲しいトピック、
感想などありましたら概要欄のフォームや
Xでハッシュタグウェブ小話で呟いてください。
ウェブはアルファベット、小話は漢字でもキラガラでも
大丈夫です。
また雨宿りしに来てください。
今回もお聞きくださりありがとうございました。
雨宿りとウェブの小話、お相手はキースでした。
さようなら。
詳しくはpodcaster.jpをご覧ください。
ナンバーワンポッドキャストクリエーターは誰だ?
