Tweet
Tweet

Slide 1

Slide 1 text

10年物のRailsアプリにキャッチアップ！ 〜コードを読まずに理解したかった〜 STORES Tech Conf 2024 "New Engineering" 2024-09-25 Mari Imaizumi @ima1zumi

Slide 2

Slide 2 text

自己紹介 2 - Mari Imaizumi @ima1zumi - 2024/04入社 - STORES 予約 の開発をしている - ruby/irb, ruby/relineのコミッタ

Slide 3

Slide 3 text

STORES 予約 とは 3 予約、決済、顧客管理ができるシステム

Slide 4

Slide 4 text

STORES 予約 とは 4 - バックエンドはRuby on Rails - First commitから11年目 - コアな開発者約13人

Slide 5

Slide 5 text

STORES 予約 - 予約者画面 5

Slide 6

Slide 6 text

STORES 予約 - 予約者画面 6

Slide 7

Slide 7 text

STORES 予約 - 予約者画面 7

Slide 8

Slide 8 text

STORES 予約 - 予約者画面 8

Slide 9

Slide 9 text

STORES 予約 - 事業者側 9

Slide 10

Slide 10 text

STORES 予約 にジョインする前に思っていたこと 10 - 予約サービス、想像つきそう - Railsは経験ある - Newなプロジェクトでも何とかなるのでは

Slide 11

Slide 11 text

予約サービスは想像できるしいけるでしょう！ 11

Slide 12

Slide 12 text

触り始めて分かった STORES 予約 の難しさ 12 - 多機能さ - 例: 月謝・回数券ごとに有効期限や予約可能回数
 - 他サービス連携
 - 移行過程の複雑さ - 例: 店舗アカウントが三世代存在
 - ロジックの難しさ - 例: 予約可否の計算


Slide 13

Slide 13 text

PR: 予約枠計算の複雑さを体感するならこれ！ 13

Slide 14

Slide 14 text

触り始めて分かった STORES 予約 の難しさ：11年分のコード 14 - 47万行 - Code 14万 - Test 23万 - 1087 Models - 705 Controllers

Slide 15

Slide 15 text

触り始めて分かった STORES 予約 の難しさ 15 思ってたより 難しい

Slide 16

Slide 16 text

それでも仲良くなりたい 16 1日の大半を共に過ごすアプリのことは知っておきたい いいところも悪いところも知って仲良くなりたい 健康でいてほしい

Slide 17

Slide 17 text

どうやったら予約のことを知れる？ 17 コードを読めば分かる？

Slide 18

Slide 18 text

どうやったら予約のことを知れる？ 18 プログラマの三大美徳 - 🦥 怠惰 - Laziness - 😡 短気 - Impatience - 👺 傲慢 - Hubris

Slide 19

Slide 19 text

どうやったら予約のことを知れる？ 19 プログラマの三大美徳 - 🦥 怠惰 - Laziness - 知らないコードを読みとくのは面倒 - 😡 短気 - Impatience - コードを読むのは時間がかかる - 👺 傲慢 - Hubris - コードを読まなくてもきっと理解できる

Slide 20

Slide 20 text

どうやったら予約のことを知れる？ 20 コードを読まずに STORES 予約 を 理解したい！

Slide 21

Slide 21 text

コードを読まずに STORES 予約 を理解したい 21 なるべくコードを読まずに理解するにはどうしたらいいか 自分がやったことや予約チームの知見を話す

Slide 22

Slide 22 text

コードを読まずに STORES 予約 を理解したい 22 - STORES 予約 ブートキャンプ - ER図 - ドキュメントを読む - 教えてもらう

Slide 23

Slide 23 text

コードを読まずに STORES 予約 を理解したい 23 - STORES 予約 ブートキャンプ - ER図 - ドキュメントを読む - 教えてもらう

Slide 24

Slide 24 text

STORES 予約 ブートキャンプ 24 - アプリの操作に慣れるためのクイズ集 - 初級・中級・上級・超上級

Slide 25

Slide 25 text

STORES 予約 ブートキャンプ 25 - 機能に触りながら慣れる - 自分の欲しいデータを作る方法がわかる - ニッチな機能をカバーできるように作られている

Slide 26

Slide 26 text

コードを読まずに STORES 予約 を理解したい 26 - STORES 予約 ブートキャンプ - ER図 - ドキュメントを読む - 教えてもらう

Slide 27

Slide 27 text

ER図 27 概要のER図と全てを網羅したER図がある

Slide 28

Slide 28 text

概要のER図 28 - 主要13モデルに絞ったER図 - 最も重要なモデルと関係がわかる - コード上で出会った時に気をつけるべきモデルがわかる

Slide 29

Slide 29 text

すべてを網羅したER図 29 - rails-mermaid_erd - Mermaid記法でER図を自動生成するgem - https://github.com/koedame/rails-mermaid_erd

Slide 30

Slide 30 text

すべてを網羅したER図 30 - モデル数が約1000個あるので必要なモデルに絞ってリ レーションを確認

Slide 31

Slide 31 text

すべてを網羅したER図 31 - GitHub ActionsでS3に自動デプロイしている - 社内認証を通して閲覧可能 - 手元でビルドしなくても常に最新版が引けて快適

Slide 32

Slide 32 text

コードを読まずに STORES 予約 を理解したい 32 - STORES 予約 ブートキャンプ - ER図 - ドキュメントを読む - 教えてもらう

Slide 33

Slide 33 text

ドキュメントを読む 33 - STORES 予約 のドキュメントは大きく3箇所にある - esa, Cosense, GitHub

Slide 34

Slide 34 text

ドキュメントを読む 34 - esa - 全社共通 - 現在15万件ほどの記事があり日々増加中 - STORES 予約 開発チームでは開発ドキュメントは Cosenseに置かれる事が多い - PRD、日報などはesa

Slide 35

Slide 35 text

35 - Cosense (旧Scrapbox) - STORES 予約 開発チームが最もよく使う - 開発に関わることなんでも書くページ - フロー情報もストック情報もある - チームのふりかえりからDesign Docまで - 現在約3000ページ ドキュメントを読む

Slide 36

Slide 36 text

ドキュメントを読む 36 - GitHub - ドキュメント用のリポジトリを切っている - ADRや意思決定の絡むドキュメントを共有 - Cosenseのコンテンツをエクスポート - Copilot Chat, ドキュメント検索botの参照先 - 詳しくはポスター発表「LLMを活用したくなったので過去 の類似Issuesを調べてくれる君を作った話」を参照

Slide 37

Slide 37 text

ドキュメントを読む: やっていること 37 - 知らないことがあったらまずCosenseを調べる - モデル名、Job名、知らない概念 - ヒットしなければCosenseにその名前でページを作る - Relineという単語がわからなければ、「Reline」 「Pure Ruby で書かれたGNU Readline互換のライン エディタ。IRBやDebugで使われている」

Slide 38

Slide 38 text

ドキュメントを読む: やっていること 38 - 一言でも書いておくことが重要 - 名前を付けることで育つ - Ref: https://scrapbox.io/support-doc-jp/必ずCosenseで探す

Slide 39

Slide 39 text

コードを読まずに STORES 予約 を理解したい 39 - STORES 予約 ブートキャンプ - ER図 - ドキュメントを読む - 教えてもらう

Slide 40

Slide 40 text

教えてもらう 40 - 知っている人がいるならこれが最も手っ取り早く正確 - 1on1で教えてもらった場合はドキュメントに残す - 知識を広げるため - 話しながら書くとその場でレビューもされて便利

Slide 41

Slide 41 text

教えてもらう 41 - LTしてもらう - STORES 予約 開発チームには毎週LTの場がある - 知りたい概念を知ってそうな人にLTしてもらう - 体系的にわかる - わかる人が増える

Slide 42

Slide 42 text

コードを読まずに理解したかった 42 - コードを読まずに分かったこと - 機能の概要 - 主要モデル・モデル間の関係 - ドキュメントにあること

Slide 43

Slide 43 text

触り始めて分かった STORES 予約 の難しさ 43 - 多機能さ - ドキュメントである程度カバー - 移行過程の複雑さ - 詳細を知っている人に聞く - ロジックの難しさ - ドキュメントになっていない箇所 - 🤔

Slide 44

Slide 44 text

44 ここまでではまだ知り合い、友達の友達

Slide 45

Slide 45 text

45 ここまでではまだ知り合い、友達の友達 少し混みいった話になると...

Slide 46

Slide 46 text

46 コードを読まずに理解したかった - 例: CSV出力内容の変更 - 「複数CSVをまとめたCSVの右端に出力しているカ ラムを左端にして、CSVをまとめない場合も左端に 出力してほしい」 - 修正した結果がどこに影響するのか分からない - ドキュメントなし

Slide 47

Slide 47 text

47 コードを読まずに理解したかった

Slide 48

Slide 48 text

コードを読まずに理解したかった 48 - コードを読まないと分からないこと - ドキュメントになっていないこと - 細かいふるまい - 変更を加えたいときにどうすればいいのか

Slide 49

Slide 49 text

49 仲良くなるためにはもう一歩踏み込まなければ

Slide 50

Slide 50 text

50 読むか...

Slide 51

Slide 51 text

51 どうやってコードを読むか

Slide 52

Slide 52 text

どうやってコードを読むか 52 - 解きたいことを明らかにする - 何を解決したくてコードを読むのか - ex: 引数に何を渡しているのか分からない - コードの中で迷子になる - 関連情報がないか探す - Git blameから実装時のPRを見て実装時のドキュメ ントや設計を探す

Slide 53

Slide 53 text

どうやってコードを読むか 53 - ざっと処理の流れを追うとき - クラスやメソッド名に着目 - 詳細に知りたいとき - プリントデバッグ - 値がどう渡ってどう変化していくのかを目的地まで 見る

Slide 54

Slide 54 text

読んでみよう 54 - 実際に知らない機能を調べてみよう - 問い合わせ例：STORES 予約 と連携しているGoogleカ レンダーに予約が連携されない - 予約番号: 0の予約がGoogleカレンダー側に連携さ れていない

Slide 55

Slide 55 text

読んでみよう：STORES 予約 と連携しているGoogleカレンダーに予約が連携されない 55 こたえ: Google カレンダーの権限が読み取りのみになって いた

Slide 56

Slide 56 text

読んでみよう：STORES 予約 と連携しているGoogleカレンダーに予約が連携されない 56 - まずは機能の概要をCosenseで把握する

Slide 57

Slide 57 text

読んでみよう：STORES 予約 と連携しているGoogleカレンダーに予約が連携されない 57 - まずは機能の概要をCosenseで把握する STORES 予約 の Google カレンダー 連携は2種類ある

Slide 58

Slide 58 text

読んでみよう：STORES 予約 と連携しているGoogleカレンダーに予約が連携されない 58 - 問題の切り分け - Googleカレンダー連携されているか - Cosenseからどのモデルで管理しているか探す Shop GoogleCalendar

Slide 59

Slide 59 text

読んでみよう：STORES 予約 と連携しているGoogleカレンダーに予約が連携されない 59 - どこまでは成功しているんだろう？ - リクエスト・レスポンスログの探し方が分からない - ログ出してるところ追ってみよう

Slide 60

Slide 60 text

読んでみよう：STORES 予約 と連携しているGoogleカレンダーに予約が連携されない 60 - どこからリクエストしてるのかわからない... - calendar_idが何らかの形でログに出ているのでは

Slide 61

Slide 61 text

読んでみよう：STORES 予約 と連携しているGoogleカレンダーに予約が連携されない 61 - ログからcalendar_idで検索してそれらしきログを発見 - Job名が判明して出力内容もわかる

Slide 62

Slide 62 text

読んでみよう：STORES 予約 と連携しているGoogleカレンダーに予約が連携されない 62 連携成功したログしか残ってない󰷺

Slide 63

Slide 63 text

読んでみよう：STORES 予約 と連携しているGoogleカレンダーに予約が連携されない 63 - 該当の予約に対してGoogle カレンダーへの連携状態が どうなってるかみてみよう - 連携状態をどこで管理しているかCosenseで探す Reservation GoogleCalendarEvent

Slide 64

Slide 64 text

読んでみよう：STORES 予約 と連携しているGoogleカレンダーに予約が連携されない 64 - schema.rbを見てそのモデルがどんな情報を持っている か確認 Reservation GoogleCalendarEvent

Slide 65

Slide 65 text

読んでみよう：STORES 予約 と連携しているGoogleカレンダーに予約が連携されない 65 - event_idがnilだった - おや？

Slide 66

Slide 66 text

読んでみよう：STORES 予約 と連携しているGoogleカレンダーに予約が連携されない 66 - どんなときにevent_idがnilになるのか

Slide 67

Slide 67 text

読んでみよう：STORES 予約 と連携しているGoogleカレンダーに予約が連携されない 67 - event_idの更新箇所や使われ方をgrepして探す - insert_to_google_calendar!の条件にnilがあるという ことは連携前ステータスを表現している可能性が高そう

Slide 68

Slide 68 text

読んでみよう：STORES 予約 と連携しているGoogleカレンダーに予約が連携されない 68 - 同期失敗してる可能性がある？

Slide 69

Slide 69 text

読んでみよう：STORES 予約 と連携しているGoogleカレンダーに予約が連携されない 69 - 同期失敗してる可能性が高い

Slide 70

Slide 70 text

読んでみよう：STORES 予約 と連携しているGoogleカレンダーに予約が連携されない 70 - 同期失敗してる可能性が高い - レコードを見るとsuspended? == true

Slide 71

Slide 71 text

読んでみよう：STORES 予約 と連携しているGoogleカレンダーに予約が連携されない 71 - suspended? == true になる条件は？ - Cosenseにあった - 連携失敗するパターンがいろいろあり見落としていた

Slide 72

Slide 72 text

コードを読む 72 仮説を立てる、コードを見る、コードを書き換える、コー ドを実行する、結果を見る、のループ

Slide 73

Slide 73 text

コードを読む 73 これはお仕事以外でやったことがある！ OSSのコードリーディングと同じ

Slide 74

Slide 74 text

コードを読む 74 - OSSでのコードリーディング - 作者不在だったり気軽に聞けないこともある - ドメイン知識がない - わかるまで分解するために大量にコメントした - インプットとして何を入れたら何が起こるのかを見た - お仕事のコードリーディングも同じ

Slide 75

Slide 75 text

コードを読む 75 - 読んで触ると理解が進む - コードベースのクセに慣れる - でもコードを読まずに分かることもたくさんある - アプリの挙動を知っていればコードをみたときに挙 動から何をしているのか想像がつく - 事前情報によってコードの可能性が狭まる

Slide 76

Slide 76 text

コードを読む 76 - 概要はコードを読まずに理解！ - 詳細はコードを読んで理解！ - コードを読んだら次は読まなくて良いようにドキュメン トを残したりリファクタリングしたりしよう

Slide 77

Slide 77 text

コードを読む 77 基本に忠実であることが New Engineering に繋がる

Slide 78

Slide 78 text

デバッグ 78 - binding.irb - 対話環境を起動
 - RSpec経由で実行することが多い
 - Debugにシームレスに移行することもできる
 - grep - LSP - Solargraph


Slide 79

Slide 79 text

読んでみよう：STORES 予約 と連携しているGoogleカレンダーに予約が連携されない 79 - 問題の切り分け - 連携日時前の予約に関する問い合わせではないか
 - STORES 予約 の仕様上連携日時開始前の予約は 連携されない
 - 連携日時開始前ではない