得意領域を超えるためのフロントエンド勉強会を実施した際の工夫

こんにちは！ソウゾウのSoftware engineerの@zuckeyです。
「メルカリShops [フライング] アドベントカレンダー2022」の10日目を担当します。

得意領域を超えて前に進むための勉強会

1日目の「ソウゾウのMove Fastを支える仕組み」でも触れられていますが、ソウゾウのエンジニアは一部の職種を除き、得意領域を問わず「全員ソフトウェアエンジニア」として働いています。そんなソウゾウのエンジニアですが、フロントエンドに専門性を持つエンジニアは他の領域と比べて少ないです。そのような状況を打破するために、フロントエンド力を向上を目的に勉強会を開催しました。もともと得意な人が少ない中で多くのメンバーには効率的に業務に役立つ知識をインプットするためには、いくつかの工夫が必要でした。 本記事では自分が行った工夫を紹介します。

フロントエンドに興味を持ってもらうための勉強会設計

普段フロントエンドのコードをあまり書いていない人にも興味を持ってもらうためには実務でも役立つテーマ選定が重要です。2日目の記事で紹介されたスキルマップやチームのメンバーにアンケートを取って検討しました。その結果、React Hooksについて、Server Side Rendering や Static Site Generation など Next.js のレンダリング関連、 ApolloClient のキャッシュの仕組みなどについての理解度がやや低いことがわかりました。これらの中から、React Hooks と Next.js についてを今回の主要なテーマとしました。加えて、今後よりフロントエンドに興味を持ってもらえるように、参加者に達成感を味わってもらえるようハンズオンパートを含む形で資料を作成しました。

実際にハンズオンまで資料を見ながらでも行える形で、 GitHub に公開していますので、興味がある方はぜひやってみてください。

勉強会資料
ハンズオン用セットアップ済みリポジトリ

開催にあたっての工夫と参加したメンバーの反応

長すぎない所要時間

ソウゾウ全体のフロントエンド力の底上げには多くのメンバーにフロントエンドに興味を持ってもらうことが重要です。参加しやすいよう、業務の調整コストや集中力がある程度持続しそうな時間を踏まえて、90分に設定しました。また、事前の単独でのリハーサルを行って1時間程度で一通り終わりそうなことを確認し、質問の回答やハンズオンで詰まった際のサポートなどができるよう時間に余裕をもたせました。参加したメンバーからも程よく質問をもらえ90分にちょうど収まるくらいで無事に終えることができました。実施後のアンケートでもちょうどよかったとの回答が100％だったので結果的にも適切な時間だったと思います。

座学とハンズオンのバランス

座学パートとハンズオンパートの割合ですが、自身がReact Hooksに初めて触れた際に、ドキュメントのみではなかなか理解しづらかった経験を踏まえて、ハンズオンパートを長めに確保しました。実施後のアンケートの自由回答でも「説明パートとハンズオンパートの割合が丁度良く、分かりやすかったです！」、「useEffectとかすごい理解深まりました。ありがとうございます！手を動かすと疑問が出てくるので、今の形式はかなり良いと思いました。」などポジティブな意見を多くいただきました。

ハンズオンのスムーズな進行のために

各自の端末の環境の違いが原因で想定通り動かないなど、ハンズオンにトラブルはつきものです。今回はそれを防ぐために、yarn installするだけで動くよう事前にリポジトリを準備する、ハンズオンの内容をサンプルとしてプルリクエストにしてステップごとにコミットにして資料のコードで確実に動くことを担保しつつ、参加者が迷った際に差分を見て理解しやすいようするといった工夫を行いました。その結果、参加した全員が時間内ハンズオンを無事に終えることができました。
事前の入念な準備の甲斐あって勉強会全体としても満足とのフィードバックをもらえ、有意義な時間になったようで良かったです。

おわりに

バックエンドなどが得意なメンバーが多い中、どれくらいの人が参加してくれるか不安に思いながら準備をしていましたが、結果的には20人以上が参加してくれました。Slackのスレッドでも疑問点や感想などが100件近く投稿されるなど、ソウゾウのエンジニアの得意領域以外の技術への関心の高さを改めて感じました。

また、やや理解しづらいものに関してはやはり実際に手を動かすことで理解が深まることがフィードバックからも改めて実感できました。特定の領域の技術力の底上げは一朝一夕には実現できないものですし、今後もこのようなハンズオン形式での勉強会を継続していきたいと考えています。具体的には、今回時間の都合で触れられなかったApolloClientについてや、アンケートで要望の多かったChakra UIなどについてのハンズオンを計画しています。

株式会社ソウゾウではメンバーを大募集中です。「全員ソフトウェアエンジニア」な環境で、得意領域を深めたり広げたりしたい方や、メルカリShopsの開発やソウゾウに興味を持った方がいればぜひご応募お待ちしています。詳しくは以下のページをご覧ください。
Software Engineer
Software Engineer, Site Reliability
Software Engineer (Internship) – Mercari Group （※新卒採用に応募するにはまずインターンへの参加をお願いしています。）
またカジュアルに話だけ聞いてみたい、といった方も大歓迎です。こちら の申し込みフォームよりぜひご連絡ください！