こんにちは。EC事業部でWebフロントエンドエンジニアをしているぬまっち(@yinm)です。最近は、「伸び放題の髪を早く切りたい…！」と思って日々を過ごしてます。
今回は、GTB(GMO Technology Boot Camp)というGMOインターネットグループの新卒研修で、フロントエンド・非同期プログラミングの講師を担当したので、研修資料の公開と準備・当日の様子をふりかえろうと思います。
研修の概要
| 受講者 | 約60名 新卒エンジニア・クリエイター(デザイナーなど) |
| 研修時間 | 4時間 |
| 開催場所 | リモート (Zoomを利用) |
研修資料
取り扱ったこと
- Webフロントエンドの開発でよく使う技術要素や用語
- 詳細まではわからなくても、どんなものがあるのかのインデックスを貼ってもらいたい
- Web APIを利用するフロントエンドアプリの開発
- 他の研修との繋がりを意識できる内容にして欲しいという注文があったので、JavaScriptからWeb APIを利用するハンズオンを用意した
取り扱わなかったこと
- フロントエンドの中でもWebフロントエンド以外のこと
- HTML/CSS
- Webフロントエンドに含まれるべきだが、別の研修で受講済みだったため
- 文法などのJavaScriptの書き方
- これによって研修自体の敷居が上がってしまうが、JavaScript Primer - 迷わないための入門書 #jsprimerなどJavaScriptを学ぶのに良い情報源があるため、そちらを参照してもらう方が良いと判断した
ちなみに、「あれも要りそう！これも要りそう！」と思って資料を作ってたら研修時間内に収まらなかったので、泣く泣く削りました…。資料自体はおまけコンテンツとしてリポジトリに置いておきましたので、よろしければどうぞ。
研修のふりかえり
ここからは研修の準備や当日の様子をふりかえって、よかったこと・改善したいことを紹介します。
よかったこと
OpenAPI SpecificationでWeb APIの定義を用意する
こちらは、JavaScriptからWeb APIを利用するハンズオンの準備で行ったことです。Web APIには、Webアプリフレームワーク入門/REST API入門研修のハンズオンで作成したWeb APIを利用(実際のフロントエンド研修のハンズオンでは、Web APIが動くことを担保したいなどの理由から、僕が用意したサブセットのWeb APIを利用)することにしたので、Webアプリフレームワーク入門/REST API入門研修の講師と仕様を決める必要がありました。集まって話し合いながら仕様を決めるでもよかったのですが、叩き台がある方がスムーズに作業が進みそうだと思い、OpenAPI Specificationを使ってWeb APIを定義しました。これによって、Webアプリフレームワーク入門/REST API入門研修の講師との仕様策定がスムーズに行えました(JSONのキー名を少し変更した程度で、話し合いもすぐに終わりました)。他にも、フロントエンド研修のハンズオンで利用するWeb APIの説明をするときに、OpenAPI Specificationの定義があったおかげで、APIドキュメントを素早く作成できたのもよかったです。今回作成したWeb APIはとても小規模なものでしたが、それでもOpenAPI Specificationを使ってWeb APIを定義することでメリットが得られるのだと実感しました。
予行練習
リモート環境で長時間話す経験が今までなかったので、不安を払拭するために予行練習しました。ハンズオンの縮小版の講師をパートナー(社員)に対してリモートで行い、フィードバックをもらうまでを1時間半で行いました。これによって、タイムキープなど研修当日に必要なスキルの練習ができたり、研修資料のブラッシュアップ(e.g. Web APIの説明のための画像を追加)ができました。協力してもらったパートナーに感謝です！🙏
また、他の講師とZoomの使い方を試してみる会を開きました。画面共有しつつ、チャットが見やすい配置を探してみたり、動画を使うときに音声を聞こえるようにするにはどうすればいいかなど、研修当日に行いたい操作を確認しました。これによって、研修当日にZoomの操作で困ることはなかったので、やっておいてよかったと思ってます。
改善したいこと
講義の難易度の設定
今回の研修で取り扱ったのは、Webフロントエンドの中でもエンジニアが担当することが多そうな内容が主体だったので、クリエイターやWebフロントエンドに馴染みの薄いエンジニアには難しい部分もあっただろうと思います(実際にそのようなフィードバックももらいました)。逆に、基礎を手厚くすれば学べることが減ってしまう人も出てくるはずなので、基礎を集中してやればいいというものではもちろんありません。落とし所がどこかはまだ見えていないのですが、現時点では敷居を下げる取り組みをした方がよいだろうと考えています。理由は受講者の裾野が広い研修なので、より多くの人に自分のレベルに応じた内容を学んでもらう方がいいと思うためです。敷居を下げるに当たって、研修時間を延長したり、場合によってはエンジニアとクリエイターの研修を別内容にするなどの対応も検討した方がいいと考えています。
まとめ
GTB2020でフロントエンド・非同期プログラミング研修の資料の公開と、研修の準備・当日の様子をふりかえりました。準備など大変でしたが、資料作成の過程でWebフロントエンドの技術を自分の中で整理し直せたなど、講師側としても学びがありました。
学習つながりで、継続的な学習を行うために実践していること - ペパボテックブログというエントリを書いたことがあるので、ご興味のある方は合わせてお読みください。