Link and Motivation Developers' Blog

リンクアンドモチベーションの開発者ブログです

LMのフロントエンドを支える組織「フロント会」の紹介

 

目次

 

LMのフロントエンド横断組織

 はじめまして、フロントエンド横断組織に所属している鵜木(うのき)です。

 今回はプロダクトや開発グループを横断して活動をしている、フロントエンド横断組織、通称フロント会のことをご紹介したいと思います。

 

フロント会とは?

 弊社では「モチベーションクラウド」を中心としたSaaSプロダクト群を自社で開発・運用しています。これらのプロダクト群や開発グループを横断して、フロントエンド技術の向上に取り組んでいる組織のことを、弊社では「フロント会」と呼んでいます。以下の画像が組織構造のイメージです。

※画像内のプロダクト・グループ・職種の数は適当です

Reference image of the organization chart.

組織構造イメージ

 上記の通り、弊社の開発組織はプロダクトごとの事業部制組織となっています。基本的には*1、各プロダクトの下に開発グループがついて開発をします。この各開発グループからフロントエンドエンジニア(以下 FE)が集まり、活動している組織がフロント会になります。

 

弊社のフロントエンド開発状況

 前述の通り、弊社では各開発グループにFEが所属してフロントエンド開発を行っています。そのためFEを含む全職種がビジネス視点を持ちやすいことが、この組織体制のメリットです。一方デメリットは、プロダクトや開発グループごとの部分最適化が進みやすいことです。

 実際、弊社プロダクトのフロントエンド領域においても

  • プロダクトごとにUIコンポーネントを実装しているため、プロダクトの数だけ開発コストが必要となっている
  • プロダクトごとにアーキテクチャが異なるため、プロダクトをまたいだエンジニアの移動コストが高い

等々の問題が発生しています。フロント会はこれらの問題をフロントエンド技術と横断視点を持って、解消していく組織です。

 

具体的な取組内容を一部ご紹介

MCS Dev Kit の開発
 フロント会では MCS Dev Kit(以下 MDK)の開発と管理を行っています。このMDKはプロダクト共通で使用するnpm モジュールの総称になります。現在はUIコンポーネントやアイコンをnpm モジュールとして運用しています。
 アプリケーションから完全に切り離して開発しているので、その時々のモダンな技術を積極的に取り入れて開発をしています!(最近だとViteとか)

 

フロントエンド推奨アーキテクチャの整備
 フロントエンド領域の推奨アーキテクチャ設計を作り、各プロダクトがそれを参考にすることで、プロダクト感のアーキテクチャ差異を減らすことが目的です。もちろんプロダクトごとの特徴もあるため、フロントエンドアーキテクチャを統一することはしません。一定の規律や秩序を設けるための活動です。

 

この2つの取組みは絶賛注力中の取り組みなので、後日別の記事で紹介する予定です!

 

さいごに

 今回はフロントエンド横断組織「フロント会」の組織紹介をさせて頂きました。今後、このフロント会で行っている様々な取組事例をどんどん紹介していきますのでご興味のある方は是非「読者登録」をお願いします!

 

最後まで読んでくださりありがとうございました。

 

*1:開発グループを横断する組織はフロント会以外にもありますが、イメージ図からは省いています