U30バックエンドエンジニアが転職でフロントエンド開発に挑戦──成長し続けた4年半の軌跡とは

【Session2】4年半の現場経験から見えてきた、フロントエンドエンジニアに必要なスキル

　フロントエンドの周辺技術は移り変わりが早く、学ぶべきことが数多くある。「HTML」「CSS」「JavaScript」「WebAPI」に始まり、ブラウザの仕様やアクセシビリティ、セキュリティなど、幅広く対応する必要がある。ITベンダーからリクルートグループの制作会社、ニジボックスに転職して4年半が経過した坂村洋輔氏は、「自分がプレイヤーやリーダーとして経験したことをありのまま伝えるので、エンジニアとして価値を発揮するための参考にしてほしい」と話した。

「分からないことだらけ」から始まったフロントエンド開発、その学習法とは？

　まず、坂村氏のニジボックスでの経験を概観しておこう。坂村氏は転職前からバックエンドの経験はあったものの、toCのフロントエンド開発は未経験だった。ニジボックス入社後、最初の案件は大規模メディアのエンハンス開発だったという。その後、『スタディサプリ』のチームでモダンフロントエンド開発や大規模なエンハンスを経験した。途中からはグループリーダーに昇進し、メンバーが成長できる環境作りにも取り組むようになった。それでは、これまでの歩みを順に見ていこう。

株式会社ニジボックス デベロップメント室 横断フロントエンド部 2グループ グループリーダー　坂村 洋輔氏

　坂村氏が最初に手がけた案件は、リクルートグループが運営するWebアプリケーションのエンハンス開発だ。「HTML」「SCSS」「JavaScript」でサイト本体のエンハンスやランディングページ（LP）の作成を行った。ニジボックスでは、基本的に1人で1案件を担当し、開発を進めていく。そのため、担当ディレクターやデザイナーとのコミュニケーションが重要になる。

　坂村氏が価値の発揮につながったと感じる要因を今から振り返ると、「納期を見すえた適切なタイミングでの報連相」「ピクセルパーフェクトなデザイン再現」「プロダクトのルールに則った可読性の高いコーディング」「メンバー追加のための受け入れ体制強化」「技術力向上やスムーズな案件進行のためのドキュメント整備」があるという。

　次に坂村氏が担当したのは、小学生・中学生向けの学習教材『スタディサプリ』のWebアプリケーション開発だ。ここではリクルートとニジボックスから数人ずつのエンジニアが参加し、スクラムで開発を進めた。

スタディサプリ

　技術スタックはフロントエンドが「Next.js」と「Apollo Client」、複数のサービスが存在するバックエンドは「Express」「Apollo Server」「Prisma」「Ruby on Rails」などが使われている。坂村氏は「当初は本当に、スクラムも、GitHubも、GraphQLも、CD/CDも、Dockerも、AWSも、何も分からなかった。たぶんもっとありましたが、あらゆることが初めてで、質問ばかりでした。フォローしてくださった先輩エンジニアのみなさんには頭があがりません」と振り返る。

　そのような状況でも、坂村氏は自分なりにチームに貢献しようと努力する。比較的難易度の低い作業や小さめのイシューには積極的に手を挙げ、なるべく多くの経験を積むことをまずは意識した。また、率先してPRレビューも行った。坂村氏は、「コードを読み解き、質問や意見を述べることは何よりの勉強になる」と強調した。

　加えて、「分からないことがあったらすぐにチャットで質問する」と坂村氏。このような取り組みは一見チームの役に立たないように感じるかもしれないが、坂村氏によると「相談した内容は記録に残る。他のメンバーが同じ問題でつまずいたときにチャットを見返して解決できることもあるので、質問することは共有ナレッジの蓄積につながる」とのことだ。「自戒もこめて、ガンガン質問と相談をしましょう」と呼びかける。こうして坂村氏は、短期間でフロントエンド開発の基礎をぐんぐん吸収していった。