featured image

プログラミング教師として一年間の振り返り 総まとめ

fbdfbdfbd

Yusuke Sugino
Yusuke Sugino

published on 2023-08-17

手前味噌ですが、手応えを感じた年度になりました。
前年度はProgateを中心に展開したが、いまいち悪かったので座学よりも実践の時間を多く取るよう試みた。

年間通しての施策や工夫

上記の課題感を受けて、年度を通して以下の工夫をしました。

  • 目的の設定
  • WEBで公開されている研修資料を使う代わりに、簡単なテキストを用意した

1/ クラス内で明確な目的を置いた

目的意識の有無が学習効率に影響を及ぼします。クラス全体として「1つのサイトを作成、共同で運営する」ことを掲げました。
コードの編集したり、最終的にはコンテンツまで考えてもらうことになりました。淡々とこなすよりも、効果を感じることができました。

2/ オリジナルテキストの用意&アーカイブの公開

以前はWEBに公開されているチュートリアル記事やIT企業の研修資料を使用していました。内容は充実している一方で、教科書的すぎるあまり余計な情報が多く混乱しやすくそれが作業の進捗や知識の定着率に悪い影響を及ぼしているようにも思えました。
オリジナルで作成し、それを見て作業を進めてもらうようにしました。

  • 知識的な解説を必要最小限に絞った
  • コードを冒頭に掲載することで、「コピペでとりあえず動かせる」をやりやすくした
    効果がありました。内容をアーカイブとして公開することにしました。

コンテンツ

3/ Notionの活用

板書や連絡のツールとしてNotionを活用しました。様々な面でメリットがありました。詳しい内容はこちらの記事にまとめています。

特に、生徒各自でコンテンツの企画を同時並行で進める際は看板状のUIで管理・内容把握ができるので効果的でした。

一年間の具体的な取り組みの内容

実際の取り組みを紹介します。

1/ Progateで雰囲気を掴んでもらう

HTMLとJavascriptコースを、あくまで雰囲気を掴んでもらう程度に行いました。前年度の反省から座学的な内容に終始してしまうのは避けたかったので、早めに実践的な内容に移りました。
ちなみに、このProgateっというサービスですが、教育機関向けのプランが用意されています。

対象の教育機関であれば申請を行うことで、 有料コースのうち2プランを無料で利用可能となっています。JavascriptコースとReactコースを選択しましたが、Reactコースの代わりにHTMLコースを選んでもよかったかなと思います。

2/ オリジナルサイトの作成

実際に制作したサイトはこちらです。時間的にフルスクラッチで作るのは無理があったので、vercelのテンプレートを活用しています。

英字の部分を日本語に直したり、新しくページを追加してもらいました。

StackBlitz Codeflowを利用した共同開発

共同開発のやり方ですが、StackBlitz Codeflowというサービスを利用しています。

  • 環境に依存しないVSCodeベースのブラウザIDE
  • Githubアカウントの連携機能があり、Gitコマンドが利用可能
  • 無料
    という点が大きな特徴です。複数人開発で必要となるプロセス
  • Commit
  • リモートブランチにPush
  • プルリクエストの作成
    があります。この操作をiPad始めとしたタブレット端末においても行うことができます。

ロゴタイプ

また、ロゴタイプを得意そうな生徒にFigmaというデザインツールで作ってもらっています。

logo.svg

こちらです。Figmaを使いこなすのは簡単ではないはずですが、1時間ちょっとの時間でサクッと作っていて驚きました。

記事コンテンツの作成

コンテンツの作成も行なってもらっています。
Notionで下書きを書く→markdownで出力する→ソースコードに反映させる。という流れになります。Notionでドキュメントを作ることは、HTMLと親和性の高いmarkdown記法の習得につながるのがメリットです。

実際に作成されたコンテンツ

3つあります。

  • 教育版桃太郎電鉄
  • マインクラフト
  • 麻雀

3/ LINE Botの作成

3学期に取り組んだことです。

Google Apps Scriptの活用

ブラウザベースで動作するため、開発環境構築を行う必要がないのがありがたかったです。

APIとの連携

Line Messaging APIを利用します。APIについて、学んでもらいました

振り返り

自信がついた。面白かった

1/ 向き合った

生徒が非常に

2/ やりたいと思うことは全部やった

皇居良俗に反しない限りは自分の裁量に任されているため、特に最新のテクノロジを現場で試せるという環境です。

3/ 成長した(生徒にさせられた)

今後

3/ AIの活用

後半には本格的に活用しました。

他の学校でもやりたい

所属する学校を問わず1つのサイト運営することを通して、ハブ的な役割を果たせたらいい。

拡大したい

  • 契約が継続すれば、履修する人が増えてほしい
  • 他の学校でもやりたい