コードレビュー虎の巻

# レビューガイドライン(Review GuideLine)

ここで述べているレビューはピアレビューについての方法です。
（作業成果物の欠陥と改善の機会を探すレビュー）

<b>「最悪を最初に」を基本としてレビューすべき、</b>
たとえば、仕様やアルゴリズムに欠陥があるのに、typoにこだわってもしょうがないので、なにが最悪かを考え、それを防ぐための物からレビューをします。

<b>誤りがプロダクト全体に影響し、手戻りのコストが高くつく、あるいは失敗するようなリスクがないかを考慮にいれてレビューの対象を選択します。</b>
たとえば、基本的な初期フェーズの要求仕様や、クリティカルな決定の基礎になる仕様、使用頻度が高いモジュールなどを重点的にレビューします。

以下に書く項目はレビュアーに負担をかけないようにするのが前提なのでレビュアーに出す前にそもそも<b>テストしたい項目</b>です。

参考：
[あなたのおっしゃるレビューってどのことかしら？](https://qiita.com/mima_ita/items/c3490ad1ccc12ad853f1)
[コードレビューの際に気をつけること](https://qiita.com/awakia/items/8344ba751426e386e0f5)

実際に試したのか、証拠としてスクリーンショットを撮ることも大事です。
<b>デメテルの法則、YAGNI、DRY、KISS、GoF</b>を意識して実装、レビューすることも大事です。

参考：
[何かのときにすっと出したい、プログラミングに関する法則・原則一覧](https://qiita.com/hirokidaichi/items/d6c473d8011bd9330e63)

最近だとGoogleもコードレビューのガイドラインを出しています。
[Google Engineering Practices Documentation](https://google.github.io/eng-practices/)
[コードレビュー 開発者ガイド（日本語訳）](https://shuuji3.github.io/eng-practices/)

# 最重要チェックポイント

 - <b>バグや設計変更があった時に、大変になるところを重点的に見る</b>
 - <b>モデルの修正は大変なので念入りに見る</b>
 - <b>メールの送信など送ってしまったら取り返しがつかないものはきちんと試してみる</b>
 - <b>セキュリティの問題を抱えやすい場所は注意する、ユーザー入力を埋め込んでる場所など (XSS/SQLインジェクション etc)</b>
 - <b>サービスの根本的な価値や、お金につながるような変更は死ぬ気で見る</b>

# 基本的なコードレビュー

- <b>関数引数の存在チェック(undefined, null, nil)</b>
- <b>境界条件でうまく動くか</b>
- <b>結果を返し忘れたりしてしまうコードパスがないか</b>
- <b>計算オーダーが短く書けないか、DB検索クエリ条件で解決できないか</b>
- <b>並列処理は同期や整合性が取れているか</b>
- <b>キャッシュを利用している箇所の場合、キャッシュ有無で両方問題ないか</b>
- <b>オブジェクト参照してる変数を上書きして意図しない挙動になっていないか(必要に応じてディープコピーする)</b>
- <b>処理系依存の処理がないか（await忘れ、C++だとvolatileなど）、どの環境でも実行順番で意図した挙動になっているか？</b>
- マジックナンバーは極力使わない。使ってもコメントで意味意図が書かれているか
- 処理が複雑な場合、仕様の説明がコメントで書かれているか
- 1つのメソッドにやたらとif文のネストある構成になっていないか
（早期return, continueできないか？）
- 名前の付け方が悪くて誤解を生みやすいものがないか
- デッドコードがないか
- 無駄な処理をしていないか
- CSR、SSRに問題ないか（SPAの場合）
- AMPの場合に問題ないか（AMPを実装している場合）

# APIのレビュー

- <b>APIパスが間違っていないか（他のAPIパスを上書きしていないか）</b>
- <b>外部サービスのAPIを呼び出す際はエラー処理をしているか</b>
- <b>リクエストパラメータの存在チェック(undefined, null, nil)をしているか</b>
- <b>リクエストパラメータに意図しないデータが入ってこないか(validate)</b>
- <b>トランザクションの処理はデッドロックが発生しないか</b>
- <b>API単体テストが書かれているか</b>
- <b>メール、メッセージ送信系（SMS、LINE）は実際に送信して、開封したメッセージがさらにリンク切れでないか確認したか</b>
- <b>課金周りの処理は計算が正しいか、エラー時にフロントエンドでの処理も表示できているか</b>
- <b>決済処理が二重決済にならないか？二重決済や不正決済を防ぐようにCSRFトークンなどで対策できてるか</b>
- GoogleBotなどは集計処理から弾いているか？

# DBのレビュー

- <b>DBクエリエラーになるケースがないか（クエリによってエラーになるケースがないか網羅できているか）</b>
- <b>変なデータが混入するケースがないか（モデルvalidateしているか）</b>
- <b>複数のAPIの条件分岐に影響するケースがないか</b>
- <b>セキュリティ的に問題のあるパラメータが渡ってこないか（XSS、SQLインジェクション）</b>

<b>DBフィールドの変更、削除に伴う修正</b>は実データをlocalhostのDBに落としてきて必ずマイグレーション確認する（実データは意図しないデータが入っていることが多い）：

- <b>モデルのマイグレーションが発生する場合、フォールバックの処理が書かれているか
（リリース後、マイグレーションスクリプトの実行が必要なケースでリリースの段階を分ける必要がある）</b>
- <b>indexを追加、変更、削除する場合問題ないか</b>

# フロントエンドのレビュー

- <b>ユーザが操作不能になるフロー、導線はないか</b>
- <b>JavaScriptエラーがないか</b>
- <b>リンク切れがないか、リンクが正しいか
- <b>ブラウザ依存の実装はないか、マルチブラウザ対策できているか(Can I useで確認)</b>
- <b>SPAの場合は、他のルーティングを上書きしていないか</b>
- <b>submitボタンがダブルクリックで二重送信してないか</b>
- APIのパスが間違っていないか
- 正しいデータが取得できているか
- APIエラーの場合の動作が実装出来ているか
- ユーザ入力データを表示する箇所はXSSのサニタイズができてるか

# ウェブデザインのレビュー

- <b>データ取得系コンポーネント（リスト等）の場合、データが空の状態の表示（もしくはローディング表示）は実装できているか</b>
- <b>各種対応ブラウザChrome, iPhone Safari, IEで表示確認できているか</b>
- <b>画面サイズを変更してレイアウトが崩れないか</b>
- <b>表示されている画像のサイズは適切か</b>
- 余白が揃っているか
- 文字サイズが揃っているか
- カラーコードに準拠しているか


# 可読性の良いコードを書く

古くからの名著に[リーダブルコード](https://www.oreilly.co.jp/books/9784873115658/)という書籍があります。
いかに読みやすいコードを書くかのノウハウとなります。
まだ読んでない人は一読しておくことをおすすめします。

- <b>命名規則を統一する。タイポ、表記ゆれをなくす</b>
- <b>処理を関数化する、意味のあるコードの塊で改行を入れる</b>
- <b>複雑な条件分岐を書かない（早期return、continueを心がける）</b>

## ドメイン駆動開発
さらに発展した考え方にドメイン駆動開発（DDD）というものがあります。
システム要件のコンテキスト（役割）に合わせてモデル（テーブル）やフィールドを作成することで仕様変更や拡張しやすい設計にします。

参考：
[役割駆動設計で巨大クラスを爆殺する](https://qiita.com/MinoDriven/items/2a378a09638e234d8614)
[関心の分離を意識した名前設計で巨大クラスを爆殺する](https://qiita.com/MinoDriven/items/37599172b2cd27c38a33)

## CRUD（Create Read Update Delete）に合わせたAPIパスにする

モデル単位のCRUD操作のAPIパスを変更するのではなくHTTPメソッドを変更することで対応します。（無駄にAPIパスの種類を増やさない）

- <b>Create: POST</b>
- <b>Read: GET</b>
- <b>Update: PUT</b>
- <b>Delete: DELETE</b>

例えばuserモデルのCRUD操作の場合

Create:POST /user ユーザ作成
Read:GET /user ユーザ一覧取得
Read:GET /user/:id ユーザ取得
Update:PUT /user/:id ユーザ更新
Delete:DELETE /user/:id ユーザ削除

のように作成します

参考：
[綺麗なAPI速習会](https://qiita.com/shimastripe/items/e9b0e1f8f8d77b89373f)

# テストの自動化

一般的に動作確認の手動テストを行うことは当たり前だと思いますが、
それに加えて、以下のテストを追加することでよりシステムの堅牢性が増します。具体的には回帰テストです。
これがなぜ大事かというとライブラリのバージョンをアップグレードしたり、仕様変更した際に他の箇所と不整合（デグレ）がないか検出することができます。
[Circle CI](https://circleci.com/ja/)、[Travis CI](https://travis-ci.org/)、[Jenkins](https://jenkins.io/)などのCI(Continuous Integration)を使うことでgit push時に継続的にテストを実行することができます。

- <b>API単体テスト</b>
- <b>E2Eテスト</b>
- <b>ビジュアルリグレッションテスト</b>

APIの単体テストには[Jest](https://jestjs.io/)（NodeJSの場合、これに[sinon](https://github.com/sinonjs/sinon)、[supertest](https://github.com/visionmedia/supertest)、[nock](https://github.com/nock/nock)、[rewire](https://github.com/jhnns/rewire)、[proxyquire](https://github.com/thlorenz/proxyquire)などのモックライブラリを組み合わせる）を使ったりします。
プロダクトのコア機能をテストするE2EテストにはJest＋[puppeteer](https://github.com/GoogleChrome/puppeteer)を組み合わせたりします。
UIの回帰テストであるビジュアルリグレッションテストは[storybook](https://storybook.js.org/)+[BackstopJS](https://github.com/garris/BackstopJS)で行ったりします。

# テストカバレッジ

[codecov](https://codecov.io/)を使うことでテストコードの全体カバー率を見ることができます。
コードカバレッジを１００％に保つ必要はないですが、システムのコア機能のカバレッジはテストの抜け漏れを防ぐためには有効な指標です。
（ただし仕様漏れの場合、実装側で抜け漏れが発生するのでカバレッジが高くてもテストの方でも抜け漏れとなります）

# LINT

lintはプログラミング言語の文法チェックです。ウェブサービスの場合は[ESLint](https://eslint.org/)で文法チェックのルールを指定することができます。
また[husky](https://github.com/typicode/husky)を使うことでgit commit時やgit push前にlintコマンドを実行させることができます。
Androidの場合は[Android Lint](https://developer.android.com/studio/write/lint?hl=ja)、XCodeの場合は[SwiftLint](https://github.com/realm/SwiftLint)などがあります。


# レビューの自動化

[danger](https://github.com/danger/danger-js)を使うことで、PRの特定の条件で警告を出したりできます。

- <b>１回のPRコードの行数が５００行を超えてる</b>
- <b>テストコードがないときに警告を出す</b>
- <b>特定のファイルに手を加えた場合に警告を出す（ORMファイルの修正をした場合など）</b>

これによりレビュアーがどこに気をつけてレビューすればよいのかわかりやすくなります。