優しいエラーでユーザーの挫折を防ぐ、Progateのコード判定の仕組み

Progateコンテンツチーム インターン生の鈴木です。

コンテンツチームについてのプチ連載もついに第5弾となりましたが、今回はProgateのコード判定についてご紹介したいと思います。
(前回までの記事は一番下にあります。)

プログラミングの習得はやっぱり難しい

プログラミングを習得するにあたって、挫折をしてしまうポイントは多々あります。
「どこに書けばいいのか、どうしたら動くのか、どうして動かないのか、何を参考にしたらいいのか」...など挙げればキリがないのですが、Progateではこのようなユーザーの学びの道を整備してあげることで、「初心者から創れる人を生み出す」サポートを行なっています。
コンテンツマネージャー曰く、「点から線を作る」作業です。

この整備は至る所で行われているのですが、今回は「コード判定」にスポットを当てたいと思います。

エラーの解読という難関

プログラミングが"通常"の勉強と異なる点として、エラーの解読があります。コードによってシステムに何かしらの不具合が起こると、英語でズラーっと吐き出される英文のことです。
本来、このエラーを解読することによって、どこがおかしいのか、次に何をするべきかなどが詳細に分かったりするのですが(もちろん曖昧なエラー文もあります)、初心者にとってはまるで宇宙言語のように感じられるかもしれません。

しかし、ここで挫折をしてプログラミング習得への道を断念してしまうのはとてももったいない、と私たちは感じています。
もちろん、プログラマーとして成長を続けていくにはエラーの解読力は必須となってくるのですが、何事にも段階というものが必要です。
そこで、Progateではコード判定の自作による、エラーの簡略化を行なうことによって、学びの道の整備をしています。

コード判定の内製

実はProgateのコード判定は内製しています。
つまり全てのパターンを想定して逐一チェックするように判定を作成しているので、判定の数は膨大となります。

少し例を見てみましょう。

(例1)Go 
以下の図は「println」と「"こんにちは、世界"」があるかを判定した後に、コード判定をしている部分です。括弧がなかったり、別の記号が用いられていた時に、具体的なエラーが出るようになっています。

(例2)JavaScript
次の例では逆に、想定される間違いに対して、具体的なエラーを出すようにしています。このケースでは配列を作成する時に、コンマ(,)をつけないユーザーがいると想定して、コード判定が作成されています。
(JE.strの部分は正規表現のためのProgateの便利ライブラリです)

(例3)JavaScript
この例では複数のコードの書き方を許容しています。JSではクラスのインポートを複数の方法で書くことができるので、複数ケースをターゲットとして記述しています。

もちろん内製にも限界はある

Progateでは上記の例で見たような細かい単位の判定を全てのレッスンで行なっています。
つまり、内製というと聞こえはいいですが、要は人力ということなので、限界ももちろんあります。

また、複数の記述が可能ではあるが、初心者の混乱を防ぐためにあえて1つの記述を採用するというケースなどもあります。
このようなケースに関しては、逐一ベストプラクティスをメンバーで相談しながら最終的なコード判定を決定していきます。

最後に

今回はProgateが「初心者から創れる人を生み出す」サポートをするための一つの施策である、コード判定について見てきました。
地道で泥臭い作業をしているんだな」と思われた方も多くいると思いますが、サービスの内容に関しては妥協しない、というProgateの姿勢をうまく表しているのではないでしょうか。

まだまだ至らぬ点もあるかと思いますが、Progateでは社内外問わず、頂いたフィードバックなどはすぐサービスに反映させて日々進化しています

この記事を通して、少しでもコンテンツチームのこと、Progateのことに興味を持っていただければ幸いです。
これからもProgateをよろしくお願い致します。

今までの記事もチェック


この記事が気に入ったら、サポートをしてみませんか?気軽にクリエイターを支援できます。

41
食べ物と旅行が好き!
コメントを投稿するには、 ログイン または 会員登録 をする必要があります。