松井です。2020年の冬学期前半に、学部3年生向けのC言語の講義をフルリモートで行いました。 これについて牛久さんに引用していただいたところちょっとしたバズりを経験したので、 忘備録として、私が経験した事例とtipsを共有します。 リモートでプログラミング講義を行おうとしている先生方のお役に立てれば幸いです。

講義の形式

  • 講義の内容は全てウェブに公開する
  • 講義の時間では、公開したウェブページを上から順番に読んでいく
  • ところどころに演習パートがあり、そこで手を止めてプログラミングする
  • プログラミングはブラウザ環境(repl.it)で行う
  • 宿題はgithub classroomで提出

ホームページ

講義用のホームページを作り情報を集約することは重要だと感じます。 リモートという性質上、学生は講義を一回聞き逃すとついていけなくなるかもしれず、 また友人にわからないことを聞くこともしづらいです。 そのため、本講義ではライブラリのチュートリアルのように、上から順番に読んでいけば全て理解できるような形式のページにしました。 (この形式は前任の川原先生の講義から引き継ぎました)

このようなホームページは、作り維持することが大変です。 よって、制作・維持が簡単な、「マークダウンからstatic htmlを作る」仕組みをとりました。 試行錯誤の結果、次のような仕組みを取りました。

  • マークダウンを書きます
  • MkDocs: マークダウンからhtmlを作ってくれるpythonスクリプトです。これを使ってマークダウンをhtmlにします
  • Materials for MkDocs: MkDocsのテーマです。上記の変換の際、このテーマを使います。
    • これにより、非常に綺麗なhtmlがレンダリングされます。また、数式admonitionといった便利な拡張機能も使えます。
    • ちなみにMaterials for MkDocsは産総研のスパコンであるABCIのチュートリアルなどでも使われています
    • 余談ですが、今回の講義にあたりマークダウンベースの静的html生成を色々調べました。2020現在で使いやすそうだったものは上記のmkdocs、github pages公式のバックエンドでもあるjekyll、研究室ホームページ用に人気があるhugo academic (最近wowchemyという名前に変わったようです)、そしてこのブログで使っているfastpagesなどでした。jekyllはrubyベース、hugoはgoベースであり、pythonベースのmkdocsが自分には一番とっつきやすかったです。
  • 上記で静的に作ったhtmlをgithub pagesでホストします。
    • 最近はmainリポジトリ上にdocsディレクトリを作りその中にhtmlを入れるだけでHPになってくれるので、非常に楽です。
  • URLは以下のようにしました
    • eeic-software1というorganizationを作る
    • そのorganization下で2020というプライベートリポジトリを作る
    • 2020をgithub pagesでウェブ公開する
    • こうするとURLがhttps://eeic-software1.github.io/2020/となり、自然です。
    • 翌年度は2021というリポジトリを作ればよいです。

この方式のメリットは

  • 0円です
  • 見かけが綺麗です
  • 完全なマークダウンベースでgit管理できるものをgithub上でホストしているので、全てgithubだけで完結します

プログラミング環境

最も苦労したのが「どのようにプログラミング環境を提供するか?」ということでした。本講義はもともと大学の計算機センターの備え付けのマシンで行うものです。リモートになった結果、急に学生側で自分で環境を作ってもらう必要が生じました。

最終的にrepl.itを採用しました。これはログインすらせずに、ブラウザ上からコーディングが出来る(リモートにマシンが立ち上がりそれを使うイメージ)ものです(ところが最近ログイン必須になってしまいました。。。残念。。。)以下、他の候補との比較になります。

repl.it

  • pros:
    • 一番簡単です。
    • エディタ画面と端末画面がしっかりわかれています。これはgccコマンドを直接使うなど、C言語とlinuxの基礎をを学ぶために適しています。
    • エディタはとてもよくできており、警告がしっかり出ます。これは初学者にとって嬉しいです。
  • cons:

Colaboratory

  • pros:
    • 大学がGSuite契約しており各学生がgmail相当のアカウントをもっている場合、アカウント管理の必要がないです。このメリットは大きいです(repl.itをはじめ、何かのサービスを使う場合は、最初に全員にアカウントを作ってもらう必要があります)
    • 無料枠で使うぶんには無料です。
    • pythonであればcolab一択だと思います。
    • 本講義と同じセメスターに開講された長谷川先生による演習講義ではこちらの方式を用いました。
  • cons:
    • c言語のcolaboratoryはまだ発展途上のようで、様々な不都合もあるようです。
    • colabの特性上、画面がエディタと端末に分かれていないようです。

ローカル環境

  • pros:
    • ローカルでコーディングできます。教育的には、ローカルコーディングはブラウザベースのものに比べて大きなメリットです。
    • 学生側がPCさえ準備できれば、C言語の環境構築そのものは基本的に無料です。
  • cons:
    • 学生一人一人の環境がわからないので、セットアップが大変です。なので結局ローカル環境は「作れる人は挑戦してみれください」という指示にとどめました。
    • とはいえ、WSL2 + VSCode Remote Devにより、普通のwindowsでもかなり簡単にlinux環境を作れる、良い時代になりました。まだWSL2のインストールはちょっと大変(powershellを開いたりする必要がある)なのですが、おそらく2021年のうちにはさらに簡単になると思います。なので「windows + WSL2」と「Mac」の二通りだけ完全にケアすれば、ローカル環境を仮定できるようになるかもしれません。

以下は試せなかったのですが気になっているものです。

GitHub codespaces

  • GitHubのリポジトリに対し「codespaces」ボタンを押すと
    1. 遠隔にマシンが立ち上がる
    2. そこにログインしてVSCodeを使うことができる
    3. そのログインやVSCodeの仕様を、ブラウザ上から行えるから使える というものです。現状はプレビュー版のみの提供です。ちょっと使ってみたところ非常に良い感じです。特に、「完全なlinux」が使えるのがよさそうです。
  • 一方で、「リポジトリに紐づく」ものなので、とりあえずmain.cを作ってコーディング、というようなタスクには向いてないかもしれません。
  • また、有料サービスなので、これを本格的に使うにはそれを考慮する必要があります(エデュケーショナルプランのようなものが出来れば最高ですが。。)

Google Cloud Shell

  • こちらはColabのような形で、codespacesのように「遠隔マシン立ち上げ + VSCode起動 + ブラウザログイン」をしてくれるものです。
  • こちらもまだベータ版なので詳細はわからないですが、今のところ弱点らしい弱点がないように見えます。無料でかなり使えるように見えます。
  • こちらはリポジトリに紐づくわけではないので、講義中での普通のコーディングはこちらのほうが適しています。逆に、「宿題リポジトリを編集してください」というようなタスクではcodespacesのほうがいいかもしれません。

宿題の提出

宿題の提出では、新しい取り組みとしてGitHub Classroomを使ってみました。学生に対するインストラクションはこういう形です。仕組みを述べます。

  • まず一つ新しく宿題用のGitHubオーガニゼーションを作り、それをGitHub Classroomと連携させておきます。
  • 宿題リポジトリを作ります。
    • たとえばREADME.mdmain.cをおきます。README.mdでは行う作業の説明。main.cは「関数を埋めろ」のようになっています。
  • このリポジトリを宿題としてGitHub Classroomに登録します。すると「宿題リンク」が手に入ります。
  • このリンクを学生に配ります。
  • クリックした学生のGitHub上に、「その学生の宿題リポジトリ」が出現します
    • 正確にはこの「各学生用リポジトリ」は上記の宿題オーガニゼーション上に作られ、それへのアクセス権限が各学生に与えられます
    • なので、宿題リポジトリは先生側からは全て見えます
  • 学生は自由に宿題リポジトリを更新します
  • 最後に、GitHub Classroom Assistantを使って、全ての学生のリポジトリを手元にcloneします
  • 手元で自動採点プログラム(自家製)を走らせ、採点します

以下に、試したがうまくいかなかった方式や、来年は変えようと思っている方式を示します。

  • 「宿題リポジトリの更新」は、add/commit/push方式ではなく、GitHub上からコードを直接編集(コピペ)してもらう形態にしました。これは、repl.itとgitコマンド直打ちの相性が悪かったからです。ここはrepl.itを使わないのであれば、最初にとにかくadd/commit/pushを教える、という方式もアリだと思います。
  • GitHub ClassroomにはGitHub Actionsを用いた自動採点機能があるのですが、色々試してみたところ煩雑そうなのでやめました。特に、結果を見るために「Actions」タブを見る必要があり、初学者には難しいか、と思いました。
  • GitHub Classroomはrepl.itとの連携機能があるのですが、これは認証部分が煩雑で躓きそうだったのでやめました。この部分は、codespacesが出来たら直接呼べるようになるのでは?と思っています。
  • GitHub Classroom Assistantの全学生リポジトリcloneは重いうえに結構失敗しました。。。また、この Assistantの機能はクローンするだけです。採点機能はありませんでした。
  • 自動採点プログラムは自分で書いたのですが、そのようなプログラムは内製すべきではないので、何か良いものがあれば使いたいなあと思っています。

Zoom

音質は学生の集中力に直結するので、良いマイクは重要だと思います。色々調べたところBlue社のYetiが最強のようなので、これ一択です。

ちなみに、Yetiは高品質なのですが、ハードウェアミュートボタンがZoomと同期しません。なので、普段のミーティングではミュートが同期する安全安心のYAMAHAスピーカーフォン YVC-200が良いと思います。自分は

  • 音質が必要なときはYeti
  • 普段使いはYVC-200

と使い分けています。

発見と今後の課題

  • 最大の発見は、チャットで送られてくる質疑は全て文字データとして残るという点でした。よって、それらの質問を後にQ&Aとして公開することが出来ました。これは通常の講義では出来ないことだと思うので、リモートがもたらしたメリットの一つだと思います。
  • 来年の講義がリモートになるかどうかまだわかりません。可能であれば非リモートでやりたいですが、もしリモートあるいはハイブリッドということになれば、GitHub codespacesあるいはGoogle Cloud Shellを試してみたいです。
  • 宿題に対するフィードバックを与えることや、グループ課題をどうするかについて、考えていきたいです。