サイボウズのフロントエンドエキスパートチームの紹介

こんにちは、フロントエンドエキスパートチームです。 今回は私たちフロントエンドエキスパートチームの紹介をします。

フロントエンドエキスパートチームとは

サイボウズの技術領域一覧
サイボウズの技術領域とフロントエンドエキスパートチームの立ち位置

まずサイボウズのWebフロントエンドについて触れておくと、以下の特徴を持っています。

  • プロダクトにとって、Webフロントエンドが非常に重要
    • B2Bのプロダクトを開発しているので、WebおよびPCでのユーザー利用率が高い
    • JavaScriptで製品をカスタマイズするためのAPIやSDKを提供している
  • 継続的な開発が必要で、Webフロントエンドの変化に追従していく必要がある
    • 大規模なWebアプリケーションが多く、プロダクトライフサイクルが非常に長い
  • プロダクトチームにWebフロントエンドがいるわけではない
    • プロダクトチームのエンジニアがWebフロントエンドからバックエンドまで一貫して担当する体制

そうした背景から、プロダクトを横断してWebフロントエンド分野に関する問題の解決を行なうチームが必要になっています。 その役割を担うのが「フロントエンドエキスパートチーム」です。

フロントエンドエキスパートが主にやっている業務内容としてはこのようなものがあります。

  • 各プロダクト（ex: kintone, Garoon)が抱える問題を探求して解決
  • パフォーマンスやテストなどアプリケーションの品質の向上のサポート
  • 最新技術をキャッチアップしてプロダクトでの活用を探求
  • 社内でWebフロントエンドに関する勉強会などを開催
  • サイボウズで管理しているOSSの開発やメンテナンス

などなど、いろいろありますが一言でいうと「サイボウズのWebフロントエンドを最高にする」ために活動しているチームです！

メンバー

フロントエンドエキスパートチームメンバー
チームメンバーで記念撮影

フロントエンドエキスパートチームは、現在7人所属しており、東京に4人、福岡に1人、大阪に1人、愛媛に1人居ます。そのうち1人(山崎）はkintoneチームを兼務しており、プロダクトチームとしての知見も活かして開発を行なっています

メンバーを一人ひとり、軽く紹介します。

  • 穴井
  • 小林
  • 外松
  • sakito
  • 山崎
  • 平野
  • じまぐ

穴井 (退職済)

  • Twitter: @pirosikick
  • 出身：大分県
  • 得意なこと、好きなこと
    • JavaScriptが好きで得意です
    • 最近はwebpackのソースコードを読んでいます
  • 入社：2019/05
  • ひとこと
    • wework、ビールが飲めて、最高です
  • 拠点：福岡
  • 登壇資料一覧

小林 (2021/10にkintoneチームへ異動)

sakito

  • Twitter: @__sakito__
  • 出身: 愛媛
  • 得意なこと、好きなこと:
    • React周り,Gatsby.js,webpackが好き
    • 勉強会やカンファレンスを運営するのも好きでよく居るので声かけてください！
  • 入社した年月: 2019/6
  • ひとこと
    • カープがすき！！！！！
  • 拠点: 東京
  • 登壇資料一覧

外松 (退職済)

  • Twitter: @toshi__toma
  • 出身: 石川県金沢市
  • 得意なこと、好きなこと:
    • WebフロントエンドはReactから入りました！とにかく新しいモノが好きです。
    • 最近はDXが上がる系のツール導入が楽しいです
  • 入社した年月: 2017年に新卒エンジニアとして入社
  • ひとこと
    • 魚が美味しい金沢出身ですが、魚介類全般食べられません（泣）
  • 拠点: 東京
  • 登壇資料一覧

山﨑 (退職済)

  • SNS: @zaki___yama
  • 出身: 北海道
  • 得意なこと、好きなこと
    • もくもくと技術調査とかするの好きです
  • 入社した年月: 2018/12
  • ひとこと
    • 🍺🥰
  • 拠点: 東京
  • 登壇資料一覧

平野

  • Twitter: @shisama_
  • 出身：大阪府
  • 得意なこと、好きなこと
    • WebやJavaScriptが好きです
    • Node.jsの中についてはちょっと詳しいです
  • 入社：2019/09
  • ひとこと
    • カレーとラーメンが好き
  • 拠点：大阪
  • 登壇資料一覧

じまぐ

  • Twitter: @nakajmg
  • 出身：埼玉県
  • 得意なこと、好きなこと
    • JavaScriptとCSSが好きです
    • SPAの開発が得意です
  • 入社：2020/01
  • ひとこと
    • 猫はかわいい😺
  • 拠点：東京
  • 登壇資料一覧

※ 最新のメンバー一覧はこちら

cybozu.github.io

フロントエンドエキスパートチーム誕生の経緯

@koba04が2018年はまだ1人だった様子
2018年はまだ@koba04だけだった

フロントエンドエキスパートチームは2017年10月に誕生しました。
サイボウズでは、各プロダクトチームのエンジニアはサーバーサイドとWebフロントエンドのどちらも書くというチーム構成になっています。
これには、サーバーからWebフロントエンド全体を見た最適な設計を可能にしたり柔軟なチーム構成が可能になるなどのメリットがあります。 その反面、分野に特化した探求などはカバーする範囲が広いため難しくなるという側面もあります。

サイボウズではすでにモバイルチームや生産性向上チームなど、プロダクトチームを支援するためのチームが存在しました。
その中で、Webフロントエンドはサイボウズのプロダクトにおいても重要な位置付けであり、専門性を追求して支援するチームが必要という問題意識から、 @koba04 が入社するタイミングでチームが作成されました。

そのため、最初の約1年は1人チームとして各プロダクトが抱える問題を解決したり、勉強会の開催などを行っていました。
そんな中、サイボウズのWebフロントエンドをもっとよくしていきたいという思いを持ったkintoneチームの @zaki___yama と @toshi__toma が兼務という形で参加してくれることになり、より多くの問題に対して取り組めるようになりました。

さらに5月、6月には @pirosikick と @__sakito__ が専任メンバーとして加わったのでチームとして動き出したところです。

フロントエンドエキスパートチームの活動内容

ここからはフロントエンドエキスパートチームが普段どのような活動をしているかを紹介します。

  • 朝会
    朝会では、前日行なったこと、今日行うことを軽く共有します。
    共有が終わったら個人的な出来事や気になるWebフロントエンド記事をネタに雑談をしています。

  • フロントエンドエキスパートチームでのモブプロ
    サービスチームでは解決できない課題やOSSについて、フロントエンドエキスパートチームメンバーで毎日2時間ほどモブプロで開発を行います。
    開発が完了するとその場でPRを出し、サービスチームに関与する場合はレビューをもらい、フロントエンドエキスパートチームだけで判断できる開発の場合はマージまで行います。

モブプロをしている様子
各拠点メンバーがオンラインに入りモブプロをしています

  • サービスチームとモブプロ
    フロントエンドエキスパートチームが開発したものやサービスチームと一緒に考えた方がいいと思った場合は、一緒にモブプロを行います。
    直近だとQAチームとReactのテストの書き方について、サービスチームのWebフロントエンド設計などWebフロントエンドに関与すること全般の関わります。

  • OSS Contribution
    利用しているOSSで問題や改善点が見つかった場合は、Pull RequestやIssueの登録を行います。 各メンバーのOSS Contributionはkintoneのアプリ上で見られるようにしています。

OSS貢献数を可視化したグラフ
フロントエンドエキスパートチームが月毎のOSS貢献数を可視化したグラフです

  • SpeedCurveメンテ&チェック
    月に1度、SpeedCurveを見ながらサービスのパフォーマンスをチェックします。
    現状は最適な指標を模索している最中です。

  • 公開しているOSSやnpmパッケージのメンテナンス/リリース
    kintone用のnpmパッケージや全体で使用するnpmパッケージ をOSSとして公開しているので、セキュリティの脆弱性やPRが来た際には随時対応をしています。 また、依存パッケージの更新をRenovateで随時行なっており、月に1度ほど変更があったnpmパッケージをリリースしています。
    こちらについては、別途記事で紹介する予定です。

  • 全体に向けてWebフロントエンド関連の情報を共有
    Webフロントエンドに関する情報をkintone上で随時共有しており、フロントエンドエキスパートチーム以外にも全社員が見ることのできる場なので、誰かが気になった情報はその場で議論しています。

    kintone上のフロントエンドエキスパートチームのスペース
    kintone上にフロントエンドエキスパートチームのスペースがあり、ここで情報が交換されています

  • フロントエンドランチ
    毎週火曜日にランチを食べながらWebフロントエンドに関する記事や、ブラウザーやライブラリの更新情報などを見ていく会です。
    参加メンバーは自由なので、さまざまなサービスの人たちでワイワイやっています。事前にみんなが気になった情報をkintone上に共有し、フロントエンドエキスパートチームが持ち回りで進行を行います。

  • 振り返り会
    毎週金曜日に、その週に対応したタスクの振り返りを実施しています。モブプログラミングで全員が取り組んでいるタスク以外にも、個人で探求しているタスクの進捗のシェアしたり、チームの今後について話し合ったりしています。

  • 勉強会の主催や登壇
    勉強会への登壇や主催運営も業務として行います。 登壇資料の作成や主催を行う場合の調整も業務中に行います。

  • もくもく会
    月に1度weworkでもくもく開発します。 内容は各自が普段の業務では行なっていないことなどをネタに探求を行います、そして最後に全員で共有します。
    9月は福岡にいるメンバーへチームの全員で会いに行き、福岡のweworkで行う予定です。

乾杯している様子
もくもく開発が終わったら乾杯をして成果報告会！

これらの業務は複数拠点間でコミュニケーションロスがないように、各自の席でZoomを使用し、オンラインで行なっています。

フロントエンドエキスパートチームの採用

Webフロントエンド技術が好きな方をお待ちしております！
福岡、広島、大阪など働く場所は関係ありません！どこでも歓迎です！

詳しい採用情報はこちら