エンジニアとして初めてコーディング規約を作った話/登壇資料（松本寛地）

Slide 1

Slide 1 text

Confidential エンジニアとして初めてコーディング規約を作った話株式会社Hacobu 松本寛地 2024年1月25日

Slide 2

Slide 2 text

Copyright Hacobu, Inc. 2 自己紹介 ❏ 松本寛地 ❏ 1993年生まれ、今年30歳 ❏ 2021年12月にHacobu入社 ❏ 入社してからずっとVistaのフロントエンドエンジニア ❏ 趣味はサッカー観戦、将棋、麻雀

Slide 3

Slide 3 text

Slide 4

Slide 4 text

Slide 5

Slide 5 text

Slide 6

Slide 6 text

Slide 7

Slide 7 text

Copyright Hacobu, Inc. 7 導入することを決めた背景メンバーによって書き方がバラバラだった ❏ メンバーの入れ替わりがあった際に、メンバーそれぞれコーディングスタイルがバラバラだった ❏ 変数やファイル名等の命名規則が人それぞれ違う ❏ メンバー間で共有したことが Linterやドキュメントに明示されていなかった定数だけどキャメルケースで書いてる。。? この前話したけど忘れてるだけ？

Slide 8

Slide 8 text

Slide 9

Slide 9 text

Copyright Hacobu, Inc. 9 導入することを決めた背景オンボーディングコストが高い ❏ 初期の方のコードと新しいコードで書き方が全然違うので、どちらを参考にするべきか都度説明する必要がある ❏ コーディング規約がないことでコードの理解に時間がかかる

Slide 10

Slide 10 text

Slide 11

Slide 11 text

Slide 12

Slide 12 text

Copyright Hacobu, Inc. 12 導入する上で気をつけたこと導入するコストを最小限にする ❏ 作った後に運用することがゴールなので、作ることに時間や労力のコストをかけたくない ❏ 既にあるスタイルガイドなどに乗っかれるものは乗っかりたい ❏ Airbnbをコーディング規約の基盤とする ❏ ルールはなるべく緩めに設定して、最低限必要なものに絞る

Slide 13

Slide 13 text

Slide 14

Slide 14 text

Slide 15

Slide 15 text

Slide 16

Slide 16 text

Slide 17

Slide 17 text

Copyright Hacobu, Inc. 17 具体的な導入手順とその成果合意形成のためのドキュメントを書く ❏ ドキュメント化の手法として、ADR（Architecture Decision Record）を採用   ❏ ref. https://cloud.google.com/architecture/architecture-decision-records?hl=ja    ❏ どうしてその意志決定をしたかなどの、背景や結果をシンプルに書くことができる     ❏ ADRは「導入する背景のADR」と「コーディング規約の ADR」を分けて作りました

Slide 18

Slide 18 text

Copyright Hacobu, Inc. 18 具体的な導入手順とその成果コードに落とし込む ❏ ESLintのconfigを新規に追加 ❏ monorepoの1つのpackageで新しいESLintの設定を導入してみる ❏ モジュールの循環参照など、自動で直せる箇所以外は手動で直す。。。 <- 今ここ

Slide 19

Slide 19 text

Slide 20

Slide 20 text

Copyright Hacobu, Inc. 20 まとめ ❏ コーディング規約はいつでも作れるが、早めにやるに越したことはない ❏ プロダクトが大きくなるにつれて入れにくくなる ❏ 属人的だった規約を機械的に解決できるなら解決した方がいい ❏ monorepo構成にしておくとpackage毎にESLint導入できるから嬉しい