フロントエンドチームで社内勉強会を始めて3ヶ月経ちました

株式会社PREVENTでフロントエンドエンジニアやってます、amakawaです。この度、4月から続けてきた社内勉強会が第10回を迎えました！

「まずはお試しで」と企画した勉強会がここまで続くかは五分五分だと思っていたので、10回の区切りを迎えた記念記事(？)です。

こんな人に読んでほしい

- 社内勉強会をやろうか迷っている
- 勉強会のやり方・テーマに悩んでいる
- 社内勉強会って意味あるの？と思っている

他のエンジニアが書いたコードが読めない。勉強会やろう。

勉強会は時間も手間もかかるので、それなりの動機が必要ですよね。私が勉強会企画を真剣に考えたのは、今年1月に今まで業務委託のエンジニア中心で作成してきたプロダクトに途中参入した時です。

社内のフロントエンドチームはエンジニア1・2年目の2人なので(私は2年目)、以前から業務委託メンバーと知識・経験の差があることは実感していました。そんな私が業務委託のエンジニア達が進めていたプロダクトのコードを読んだ率直な感想は

「このままではヤバい」

具体的には、

- 社内フロントエンドチームが業務経験のないTypeScript、GraphQLなどが使われている(もちろん知ってたし、個人開発ではTS書いてみたけどレベチだった)
- GraphQLのクエリを生成するメソッドなど「使い方はわかるけど内部処理の意味がわからない」メソッドが多かった
(メソッド作成はとてもとても有難いです。社内メンバーが内部動作を理解できないのは単にこちらの実力不足)

という状態で、業務委託のエンジニアが今後プロジェクトを離れた際に、このままでは社内フロントエンドチームでプロダクトを改修・保守できないのでは？という危機感まで覚えました。

経験の浅いチームが成長するには？

業務委託のエンジニアと思った以上に知識・経験差があることを実感して「自分たちに何ができるだろうか？」と考えた時に浮かんだのが勉強会でした。

コードレビューや会議以外で業務委託のメンバーに力を借りることも考えましたが、彼らが平日夜や土日に働いており基本的に非同期コミュニケーションであること、時間給ベースで仕事をしていることから、業務委託のメンバーの参加を前提とした内容は難しいと判断しました。

目の前の業務か、中長期的なスキルアップか

次に考えたのは勉強会の目的です。

スキルアップは当然ですが、目の前の業務に対応できるようになりたいのか？基礎力をつけたいのか？担当できる業務範囲を増やしたいのか？だと勉強会の内容が大きく変わります。

そこで、いくつか案を出して、もう1人のフロントエンドエンジニアと相談してみました。

目的案
- 目の前の業務(途中参入したプロダクト)に対応できるようになりたい？
- JavaScriptのメソッドや仕組みをもっと理解できるようになりたい？
- ブラウザの仕組みやセキュリティなど、フロントエンド業務で関連する分野を理解できるようになりたい？

ここで「目の前の業務を進められるか不安があるので、まずは今のプロダクトに関する内容をやりたい」という意見をもらい、途中参入するプロダクトのコードリーティングから始めることにしました。

(この時はもちろん通常業務でもコードを読んでいましたが、勉強会という形で、改めて複数人で読んで勉強する時間を取ろうという意図です。)

この時点で開発リーダーに勉強会の許可をもらいに行き、二つ返事でOKをいただきました。

ということで、今回の勉強会は準備も実施もすべて業務時間内でやってます。

その後は開催にむけて詳細を2人で決め、第1回はさっそく一番分からない部分を...ということでGraphQLの関連部分を分担して読むことにしました。

日時: 毎週金曜の13:00~14:00
場所: リモート(Discord)
詳細: 自分の担当箇所のコードを読んで、理解できない部分を調べてくる。当日は、お互いに自分の担当箇所の動作や使用されているメソッドを説明する。

発表形式や時間制限は特に決めません。私はNotionにコードを貼り、自分が調べた内容や参考リンクを書き込んでいます。

勉強会後はこのメモを社内wiki(esa)に転記して、興味があるテーマは誰でも見れるようにしています。

(第一回の勉強会メモ。この画面をDiscordで共有しながら喋ってます)

テーマによってはデモをCodeSandboxで作ったり、サンプルアプリを作ることもありますが、ここは完全に個人の自由です。

1回目やってみた感想は？

楽しい！

普段の業務はissue消化を優先しがちになるので、こういった「使い方はわかるけど実は内部動作の理解に自信がない」コードを読むことに堂々と時間を使えるのは嬉しかったです。

また、あえてプロダクトの中でも複雑な部分を先に取り上げて、「関連するissueをやる時に1人で悩むことになるのでは？」という不安を除けたのは良かったと思います。

3ヶ月続けてどうなった？

第1回に引き続き、最初の数回はGraphQL, TypeScript, Firebaseなど、プロダクトの中で不安な部分のコードリーディングを一緒に行いました。しかし、4回目くらいで大きな不安要素をカバーできてしまったので、それ以降は自分が興味のあることを調べて発表するというかなり自由度の高い形式にしています。

自由度が上がったことで当初の「目の前の業務に対応できるようになる」という目的からはズレましたが、中長期的に役立ちそうな分野まで勉強会の幅を広げられたと考えています。

個人的には、Vueのリアクティブの内部動作やVue3系の新機能など、気になるけど勉強するモチベがなかなか持てなかった内容を学ぶことができました。

研修もほぼ無く「現場で強くなれ！」になりがちなベンチャーでは、コストも比較的低く、費用対効果が大きい（メンバーがアウトプットする主体となるので）勉強会はエンジニア育成に合っているのではないか？と感じます。

(Composition APIをテーマにしたときのメモ。サンプルコードを見ながら「社内で使うならどんなユースケースがあるだろう？」「採用しているデザインシステムとの相性は？」といった会話ができるのも嬉しい)

参考: 今までの勉強会テーマの一部
- GraphQLのクエリを生成するメソッド(現在のプロダクトから)
- VuexとTypeScriptを併用するときの型付け(現在のプロダクトから)
- FirebaseのRealtime Database(現在のプロダクトから)
- Vueの従来のリアクティブと3系のリアクティブの内部動作の比較
- Vue.setの内部動作
- vm.$listenersとvm.$attrsとは？
- Quasar触ってみた

なが〜〜〜く勉強会を続けるために

さきほど勉強会は「コストも比較的低く」と書きましたが、「いや、めっちゃ大変だよ！」という方もいると思います。

私は今まで社内/社外で自然消滅していった勉強会も見てきたので、とにかくコストを下げて続けることを意識しました。具体的には以下のような点です。

- 資料はつくらなくていい

スライドが必要になると準備のハードルが上がります(体験談)。

もちろん、スライドを作る過程で情報の見せ方やプレゼン能力を学ぶことはできますが、今回の勉強会はプレゼンの質よりも内容の質が大切なので資料は不要にしました。

私はメモがないと話せないタイプなのでNotionにメモをしてきますが、サンプルコードと公式ドキュメントを交互に写しながら喋ることも多々あります。自分が書いたコードとドキュメントを紐付けて、他人に説明できるほど理解できているなら勉強会の目的は果たせている、という考えです。

- 分からない部分やうまく説明できない部分があってもいい

調べたけど理解しきれなかった...自信ない...ってあると思うんですよ。新たしいことを調べて、コードを書いたり考えることに意味があるので、完全に理解できない箇所があっても問題はないと思ってます。

もちろん「ここまでは理解できたけど、ここが分からない」くらいの説明は必要ですが、そこからは他のエンジニアも一緒に考えればOKです。話す人・聞く人の分かれ目が無く常に一緒に考える場を作れているので、今のフロントエンド勉強会は良い雰囲気です。

- 準備できなかった日があっても責めない

「今日の勉強会、準備できなかったんです」という日があってもお互い責めません。というか責めたくないです。

それまで勉強会の準備に使っていた時間にも業務をしなければいけないくらいタスクを持っていた、ということなので、その場合は現在のタスクの話を聞いたり、勉強会の形式を見直すべきか？といった話をします。

タスク配分や勉強会の形式もチームで考えるべきテーマですし、情報共有のきっかけの場になることも勉強会の機能の一つとして捉えています。

で、勉強会って意味あるの？

今回の記事を読んでわかるように、勉強会は決して「明日から役立つ」ような便利なものではありません(そもそもそんな美味しい話はあるのか？)。

それでも、今後課題になりそうな部分の解消・メンバー育成・新技術へのキャッチアップ・社内コミュニケーション増加・エンジニアのアウトプットが上手くなるなど中長期的に見ればメリットがありますし、個人的には社内勉強会が盛んな企業は魅力的なので採用に繋がる可能性も大きいと感じます。

上記のメリットに加えて、週2~3時間(準備含め)の勉強会を通してエンジニアがもっと積極的に楽しく仕事ができるのですから、決して高いコストではないと思うのですがいかがでしょうか？

ちなみに社内の印象もいい感じで、「うちのチームも勉強会やろうかな」という話が出てきたり、「勉強会を覗いてみてもいい？」と聞かれることもありました。社内では今後も勉強会が増えていく予感...！？

今後の参考として、他社の社内勉強会の内容を知ることができたらよいな〜〜と思うので、社内勉強会の内容や工夫点などコメントでいただけると嬉しいです！！