6
4

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

Gakken LEAPAdvent Calendar 2024

Day 2

フロントエンドエンジニア多能工への道

Last updated at Posted at 2024-12-01

はじめに

こんにちは、Gakken Leap のフロントエンドエンジニアの日下です。

Shikaku Pass 開発チームでは現在チームの生産性向上のため、エンジニア多能工化を目指し活動を行っています。日々の取り組みの中で気づいたことをこの記事で書いていこうと思います。

背景

多能工という言葉はあまり一般的ではないと思います。この言葉はトヨタ自動車工業で副社長を務めていた大野耐一氏によって考案されたといわれており、多様な業務が行える人材のことを指します。

多能工で構成されたチームでは、余裕のあるエンジニアが人手の足りない実装工程を支援することで、効率的に開発を進めることができます。

Shikaku Pass 開発チームでは、フロントエンドとバックエンドでチームが分かれています。フロントエンドは Nuxt、バックエンドは Ruby on Rails を使っており、技術が異なるためチーム間でのエンジニアの移動というものはほとんどありませんでした。

全体的な傾向としてフロントエンドの作業が早く終わり、バックエンドの作業がボトルネックになるケースが多々あり、その際にフロントエンドチームに手待ちが発生してしまうという問題がありました。

フロントエンドエンジニアの手が空いたときは、リファクタリングや自動テスト開発等を進めるのですが、それらのタスクはスプリントゴール達成には直接寄与しないものでした。

結果としてマイルストーン通りの開発スケジュールを守ることが難しくなってきたため、チームの生産性向上を目指しこの取り組みが始まりました。

どのようなことをしたか

多能工化を目指すにあたり、まずはフロントエンドエンジニアがバックエンドも触れるようになろうということで私がバックエンドのチケットを取ることから始めました。

私は過去 Rails の Tutorial や erb テンプレートの開発はやったことがあるものの、業務で毎日触っているわけではなかったので、Ruby on Rails ガイドや海外のチュートリアルを読み、基本の部分から学び直しました。

その後、お手本のある簡単なチケットから消化することにしました。

細かくバックエンドのメンバーと連絡をとり、進め方や疑問点をすり合わせ認識齟齬が起こらないことを強く意識して取り組みました。

また、一人で進めるのが難しい箇所等はペアプロも取り入れながら実装を行いました。

この取り組みを始めて1ヶ月と少しですが、遅延が発生しそうだった機能開発もスケジュールに収まり、チームとしての生産性は上がったと思います。

学び

比較的スムーズに多能工化への一歩を踏み出せたかと思いますが、成功のために意識しておくべき点が 3 つあると感じました。

システムの関心の違いを理解する

フロントエンドのシステムとバックエンドのシステムでは関心が異なります。

  • フロントエンドはデータをいかに表示するか。
  • バックエンドはデータをいかに保存するか。

フロントエンドではデザイン、アクセシビリティ、デバイスやブラウザ差異、状態管理といったことが注目される一方で、
バックエンドではバリデーション、セキュリティ、パフォーマンスといった要素が重要視されます。

異なる関心ごとを持ったシステムであるということを踏まえて臨むと、既存コードやレビュー指摘の意味を理解しやすく、セルフレビューの際、考慮漏れにも気づきやすくなります。

システム間を越境する際は上記のように頭を切り替える必要がありますが、このスイッチングコストは思った以上に大きく、最初は疲れると思います。
なので、できれば同一スプリント内で別システムの作業は入れない方が良いと思います。

MVC や SQL 等の基礎知識を学習する

私は Rails のチュートリアルから始めましたが、MVC モデルや SQL といった前提となる知識は必要かと思います。

フロントエンドエンジニアは基本的に View の部分のみを担当するケースが多いと思います。

私もフロントエンドのキャリアの中でほとんど View 部分のみ担当していましたが、新卒の頃に社内研修で MVC モデルや SQL について勉強したことがあったので Rails のドキュメントがスムーズに読めたかなと思います。

もしもそれらについての知識がない場合は、MVC の概念や SQL の文法等学習していくのがおすすめです。

Rails のチュートリアルのみでもコードを書き始めることはできると思いますが、それらの概念がわかっていないと応用が効かず困ってしまうと思います。

特に Active Record の各種メソッドがどのような SQL を発行するのかといった部分は Rails 理解の肝じゃないかと感じました。

ちなみにフロントエンドだと HTML,CSS, DOM 操作周りの知識が基礎知識にあたると思います。

コミュニケーションは丁寧に行う

普段触っていない別のシステムを開発するときは誰でも不安を覚えます。

特に最初のうちはわからないことがわからない状態で質問すら思い浮かばないでしょう。
私も進めていく中で始めて疑問が湧くといったことが多々ありました。

なので、細かくコミュニケーションを取り、認識齟齬が起きないように進めるが望ましいです。

まずテストケースを書いて確認してもらうと大きく認識がずれないのでおすすめです。

細かい実装方針についても、自分なりの仮説を立てて質問するとスムーズに進みます。

コミュニケーションが多いと相手の時間を奪ってしまうのではないかと不安になるかと思いますが、
細かく会話をして指摘を取り込むことで、後々レビューが楽になるという副次効果もありました。

認識齟齬を生まずに作業を進めた方が結果としてリードタイムは早くなるのではないかと感じました。

まとめ

Shikaku Pass 開発チームでは、チームの生産性向上を目指してエンジニアの多能工化に取り組みました。フロントエンドエンジニアがバックエンドの開発もサポートすることで、開発のボトルネックを解消し、スケジュール通りの開発を実現することができました。
この取り組みから得られた重要な学びは以下の 3 点です:

  • フロントエンドとバックエンドではシステムの関心事が異なることを理解し、コンテキストの切り替えを意識して開発を進める。
  • MVC モデルや SQL などの基礎的な知識の習得が、新しい技術領域に挑戦する際の重要な土台となる。
  • 不慣れな領域での開発では、細かなコミュニケーションを取り、認識齟齬を防ぐことが結果的に開発の効率化につながる。

多能工化への取り組みは、個人の技術的な成長だけでなく、チーム全体の生産性向上にも大きく貢献します。今後も継続的な学習とチーム間の協力を通じて、より効率的な開発体制を築いていきたいと考えています。

エンジニア募集中

Gakken LEAP では教育をアップデートしていきたいエンジニアを絶賛大募集しています!!
ぜひお気軽にカジュアル面談へお越しください!!

6
4
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
6
4

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?