⛑️

カオナビのフロントエンド支援チームについて

2021/12/22に公開

https://qiita.com/advent-calendar/2021/kaonavi

この記事はカオナビ Advent Calendar 2021 22日目です。

はじめに

はじめまして、カオナビでフロントエンドエンジニアをしている松崎です。

今年もあと少しですね!
今回は自分が所属している10月から正式に発足した
フロントエンド支援チームについての話をします。

これまでのフロントエンド

カオナビではフロントエンドエンジニアが約12名ほどいますが、
プロダクトが大きくなるつれてそれぞれ並列で開発することが多くなっています。

こまごました課題に関しては、各人が業務の隙間を見つけて対応し
大きな課題の解消に関しては、負債解消の目処が立たなかったり
「いつ対応するの?」「具体的には?」のように対応方針を求められたり
ということが起きていました。

また現状負債にはなっていないけど、フロントエンドは変化が激しく対応が遅れることで
負債化する可能性が高いため、課題解決や方針決めを素早く行っていく必要があります。

これらの経緯からフロントエンド支援チームが発足しました。

フロントエンド支援チームについて

10月にチーム化したフロントエンド支援チームは
現在テックリードと自分二人三脚でやっています。

活動方針

フロントエンド支援チームの活動方針として現在は以下の3つの指針を立てています。

  1. 各チームのフロントエンドが抱える問題を専門性を持って解決する
  2. カオナビ全体のフロントエンドの改善
  3. 技術負債の返済

各社の横断チームを参考にしていたりするので、皆さん見慣れた方針かもしれないですが
共通して「改善」を意識している方針になっています。

カオナビのエンジニアは、情報の発信や社内での技術交流、週一の社内勉強会が
割と頻繁に行われていて、個人のやりたいことに制限がかかるような体制でもないため
フロントエンド支援チームが対応する優先度として「改善」を軸にしています。

技術交流など気になった方はカオナビAdvent Calendar 2021の1日目の資料を見てみてください。
https://zenn.dev/matsukaz/articles/e75ea18506f7cd

主な活動内容

先ほどまとめた活動方針をもとに、発足してから約2ヶ月様々な活動を行ってきました。

1. 各チームのフロントエンドが抱える問題を専門性を持って解決する

日々業務を行っていく中でさまざまな問題や課題が出てきます。
例えば
「ライブラリ更新されないからこのプロパティ使えないなぁ」
「ビルド時間遅いなぁ」
「何が問題かわからないけど、なんとなく開発中のここ自分だけが辛いのかな?」
など課題は明確だが手が回らないものや抽象的な問題が生まれては各人抱えている
のではないかと考えました。

そこでフロントエンド支援チームでは課題・問題管理表を作成し
具体的なものから抽象的なものまで発散する以下のようなシートを作成しました。

一部抜粋
一部管理表

結果としてはすでに50件ほど溜まっていて、思っていたよりもいろいろと考えている人が
多いなという印象でした。

集まった課題・問題としては大小さまざまで
「パフォーマンスの可視化したい!」
「このパッケージアップデートしたい!」
「アクセシビリティ方針は?」
などとにかく発散を目的としたシートになっています。

上記で集めた全ての課題に関して、週一でフロントエンド支援チームMTGし回答をしています。

またすべての課題をいきなり手を動かして対応していくと途方もない時間がかかり
活動が困難になるため自分たちでやったほうがいいものか、今後の方針に合っているか
など優先度を決め自分たち含めてみんなで取り組んでいます。

2. カオナビ全体のフロントエンドの改善

改善項目は皆さん意識が高く、すでに課題・問題管理表で挙げられていて詳細は割愛しますが

フロントエンド開発を行なうえでプロダクトに合った理想的な状態を
フロントエンド支援チームで相談し現状の課題と照らし合わせ、改善を進めています。

中にはフロントエンドだけで完結しない改善もあるため、必要とあらばデザイナー、エンジニア関係なく相談するようにしています。

3. 技術負債の返済

こちらに関してもすでに課題・問題管理表で挙げられていて詳細は割愛しますが

カオナビではjQuery, React, Laravelなど、羅列するだけでなんとなく分かる負債があり
リプレイスやリニューアルが進められています。

支援チームとしても根幹部分の変更やビルド環境の改善など
ロードマップを立てて対応にあたっています。

詳細が気になる方は現在二人三脚しているTechLeadが
前回開催されたJSConf JP 2021で行ったLTがあるのでこちら見てみてください!

YouTubeのvideoIDが不正ですhttps://youtu.be/Rmvt9Gt0VMk?t=4909

気をつけていること

課題管理と理想の状態のバランス

新しい技術のキャッチアップや課題管理などバランスよく行えるように気を付けています。

  • 理想の状態だけを推し進めても振り返ったときに周りに誰もついてきていない
  • 課題解決だけを推し進めても将来どうしていきたいかわからない道に迷った状態の開発

どちらもバランスを取らないと起きてしまうので偏らないよう気をつけています。

アンケート

絶賛実施中なのですが、フロントエンドメンバーに向けて
期初と期末にアンケートを実施しています。

課題・問題管理表だけでは潜在的な課題はキャッチアップできないと考えたためです。

その他にも

  • 課題管理と理想の状態とのバランスを図る
  • 開発でいいと思っている部分がどこか
  • 自分たちで決めている優先度のズレがないか

などを調査するために実施しています。

おわりに

本来であればフロントエンド支援チームのような活動は個人で行えるか
課題がないような状態になるのが理想的だと思います。

ただプロダクトが成長していく中で人が増え、求められる機能のレベルが上がり
利用している技術も変化していくので難しいのが現実です。

まだ発足から間もないので、今後の活動がどうなっていくかは楽しみなところですが
早く改善していいプロダクトを届けられるよう進めていきます。

明日以降もアドベントカレンダー続きますので引き続きよろしくお願いします!!

https://qiita.com/advent-calendar/2021/kaonavi

Discussion