Tweet
Tweet

Slide 1

Slide 1 text

プルリクとの 上手な付き合い方 Event / NaITE #30 プルリクとの上手な付き合い方 and もくもく会 Date / 2019-03-23 (Sat) Presenter / Naoto Teshima (tosite / まおちゃ)

Slide 2

Slide 2 text

はじめまして

Slide 3

Slide 3 text

わたし

Slide 4

Slide 4 text

No content

Slide 5

Slide 5 text

GMOペパボ ホスティング事業部 ムームードメイングループ所属 手島 尚人 インターネット上ではまおちゃという名前で バーチャルJKやってます

Slide 6

Slide 6 text

最近はRuby on Railsや Laravelなどを書いています

Slide 7

Slide 7 text

Twitter : @mao_sum Blog : tosite.work NaITE・JaSST九州・ PHPカンファレンス福岡 の実行委員もやっています

Slide 8

Slide 8 text

おもしろ自己紹介

Slide 9

Slide 9 text

ref: https://kimromi.hatenablog.jp/entry/2019/02/23/225740

Slide 10

Slide 10 text

はい

Slide 11

Slide 11 text

はじめに

Slide 12

Slide 12 text

皆さん、プルリクを 作っていますか？

Slide 13

Slide 13 text

Git全盛期の昨今 名前だけでも聞いたことが あるかと思います

Slide 14

Slide 14 text

特にチーム開発を行う場合、 プロダクトの品質を担保するためにも プルリク→コードレビューの流れ は必要不可欠かなと思います

Slide 15

Slide 15 text

そんな中で、こんなプルリクを 見たことはありませんか？

Slide 16

Slide 16 text

No content

Slide 17

Slide 17 text

No content

Slide 18

Slide 18 text

^q^

Slide 19

Slide 19 text

おおよそニンゲンには 検知不可能な変更量

Slide 20

Slide 20 text

そしてこんなコミットを 積んでいませんか？

Slide 21

Slide 21 text

No content

Slide 22

Slide 22 text

^q^

Slide 23

Slide 23 text

何が変わったのか わからない

Slide 24

Slide 24 text

今日は よいプルリクを作るには？ プルリクとの上手な付き合い方 を実体験からお話ししていきます

Slide 25

Slide 25 text

参考文献：イシューからはじめよ

Slide 26

Slide 26 text

起

Slide 27

Slide 27 text

知的生産者 としての心構え

Slide 28

Slide 28 text

知的生産者としての心構え ってなんだと思いますか？

Slide 29

Slide 29 text

知的生産者としての心構え 最小限の時間で 最大限の生産性を出す 方法を考えていくことだと思います

Slide 30

Slide 30 text

知的生産者としての心構え そのためには 犬の道 から脱却しなくてはなりません

Slide 31

Slide 31 text

知的生産者としての心構え 犬の道とは

Slide 32

Slide 32 text

知的生産者としての心構え 一心不乱に仕事を することで問題解決 していこうとする姿勢のこと

Slide 33

Slide 33 text

知的生産者としての心構え

Slide 34

Slide 34 text

知的生産者としての心構え

Slide 35

Slide 35 text

知的生産者としての心構え 限られた時間・リソースの中で効率を高めるには 課題の本質を見抜き 解の質を高めていく ことが必要不可欠です

Slide 36

Slide 36 text

知的生産者としての心構え 特にありがちなのは、 丁寧にやりすぎた結果 膨大な時間を費やしてしまう ことです

Slide 37

Slide 37 text

知的生産者としての心構え もちろん丁寧さは大切ですが、それ以上に イテレーションの回転数・スピード感 を上げていくことが最重要です

Slide 38

Slide 38 text

知的生産者としての心構え 考える 答えを出す 答えを出す 考える 答えを出す 考える 答えを出す 考える 時間

Slide 39

Slide 39 text

知的生産者としての心構え 考える 答えを出す 答えを出す 考える 答えを出す 考える 答えを出す 考える 時間

Slide 40

Slide 40 text

知的生産者としての心構え そのためにも Issueやプルリクと 上手に付き合いつつ 犬の道から脱却していきましょう

Slide 41

Slide 41 text

閑話休題 -海の話-

Slide 42

Slide 42 text

閑話休題 突然ですが皆さん、海に 泳ぎに行ったらどうしますか？

Slide 43

Slide 43 text

閑話休題 いきなり着替えもせずに海に入る、 ということはしないと思います

Slide 44

Slide 44 text

閑話休題 まずは着替えて、日焼け止めを塗って、準備運動して… 事前の準備を済ませてから 泳ぎますよね

Slide 45

Slide 45 text

閑話休題 何かを作るときにも同じで、 いきなり飛び込まずに 最初に考える時間を作る ことが大事だと僕は思います

Slide 46

Slide 46 text

閑話休題 そもそも何の問題を解決するためなのか どういった問題があるのかなど、やるべきことを 大きいことから徐々に細かく分解 していくといいです

Slide 47

Slide 47 text

閑話休題 このあたりの詳しい話について興味のある方は イシューからはじめよ をご覧ください

Slide 48

Slide 48 text

ポイントは 悩まないこと

Slide 49

Slide 49 text

ポイントは悩まないこと 皆さん、悩むことと考えることは どう違うと思いますか？

Slide 50

Slide 50 text

ポイントは悩まないこと アイスブレイク3分： 自己紹介 話し合う

Slide 51

Slide 51 text

ポイントは悩まないこと 悩む

Slide 52

Slide 52 text

ポイントは悩まないこと 決めかねたり解決の方法が 見いだせなかったりして、心を痛める。 思いわずらう。 goo辞書： https://dictionary.goo.ne.jp/jn/165175/meaning/m0u/%E6%82%A9%E3%82%80/

Slide 53

Slide 53 text

ポイントは悩まないこと 考える

Slide 54

Slide 54 text

ポイントは悩まないこと 知識や経験などに基づいて、 筋道を立てて頭を働かせる。 goo辞書： https://dictionary.goo.ne.jp/jn/47607/meaning/m0u/%E8%80%83%E3%81%88%E3%82%8B/

Slide 55

Slide 55 text

ポイントは悩まないこと 考えても答えが出ないことに 思いを巡らせることが「悩む」 具体的に解決への道筋を 組み立てることが「考える」

Slide 56

Slide 56 text

ポイントは悩まないこと 僕自身悩むこともそれはそれで好きではありますが… 10分考えて分からないことは 悩んでいる可能性が高いです 悩むことをやめて聞こう・相談しよう

Slide 57

Slide 57 text

ポイントは悩まないこと でも、誰かに相談された場合に、 思考の順序や道筋が見えない と相談を受ける側もよくわからないことがあります…

Slide 58

Slide 58 text

フレームワークを 使おう

Slide 59

Slide 59 text

フレームワークを使おう 考えを整理するにあたって、 フレームワークの力を借りる ことはとても有益です

Slide 60

Slide 60 text

フレームワークを使おう 5W1Hやなぜなぜ分析 といった言葉を耳にしたことはありませんか？

Slide 61

Slide 61 text

フレームワークを使おう 個人的にオススメなのは マインドマップ です

Slide 62

Slide 62 text

フレームワークを使おう

Slide 63

Slide 63 text

フレームワークを使おう 思考の過程が可視化される ため、他の人が見たときにわかりやすいと思います

Slide 64

Slide 64 text

承

Slide 65

Slide 65 text

プルリクを 構成するもの

Slide 66

Slide 66 text

プルリクを構成するもの

Slide 67

Slide 67 text

プルリクを構成するもの コミット

Slide 68

Slide 68 text

プルリクを構成するもの どんな作業をしたのかが一言で言える ようなコミットがわかりやすいです

Slide 69

Slide 69 text

プルリクを構成するもの あとでレビューを受けるときに コミット単位で見られる ことを考えておこう

Slide 70

Slide 70 text

プルリクを構成するもの タイトル

Slide 71

Slide 71 text

プルリクを構成するもの 例えばリリースして半年経過して、 過去のプルリクを検索する、 といったシチュエーションを 想像していただきたいのですが

Slide 72

Slide 72 text

プルリクを構成するもの

Slide 73

Slide 73 text

プルリクを構成するもの こちらとこちら、 どちらが見やすいですか？

Slide 74

Slide 74 text

プルリクを構成するもの 後から探しやすいタイトル をつけることを意識していきましょう

Slide 75

Slide 75 text

プルリクを構成するもの 細かいことは次の概要に書いていくので、 あまり説明的になりすぎない ように気をつけましょう

Slide 76

Slide 76 text

プルリクを構成するもの 概要

Slide 77

Slide 77 text

プルリクを構成するもの 超重要

Slide 78

Slide 78 text

プルリクを構成するもの レビュアーがここを見たときに プルリクの意図をパッと掴める ように整えておきましょう

Slide 79

Slide 79 text

プルリクを構成するもの 5W1Hに沿って書き出す、 概略図などを掲載する などしておくと最高です ref: https://kimromi.github.io/2017-08-31/pull-request.html

Slide 80

Slide 80 text

プルリクを構成するもの GitHubであれば テンプレートを登録 することもできるので、活用していきましょう

Slide 81

Slide 81 text

プルリクを構成するもの コメント

Slide 82

Slide 82 text

プルリクを構成するもの 基本的には議論の場 なので、どんどんコミュニケーションを 取っていきましょう

Slide 83

Slide 83 text

プルリクを構成するもの 最近やり始めましたが、 変更したコードの補足説明を 自分で入れる などするとわかりやすいです

Slide 84

Slide 84 text

プルリクを構成するもの こんな感じ

Slide 85

Slide 85 text

プルリクを構成するもの

Slide 86

Slide 86 text

プルリクを構成するもの 他にもコメント部分に スクリーンショットや 実際のレスポンスなど のエビデンスを記載しておくと丁寧でGoodですね

Slide 87

Slide 87 text

プルリクを構成するもの ラベル

Slide 88

Slide 88 text

プルリクを構成するもの 僕のチームでは プルリクの状態を管理する のに使っています

Slide 89

Slide 89 text

プルリクを構成するもの

Slide 90

Slide 90 text

プルリクを構成するもの レビュー待ちの状態・マージ可能な状態・ WIP（下書き） の状態など ラベルからパッとわかる

Slide 91

Slide 91 text

プルリクを構成するもの レビュー

Slide 92

Slide 92 text

プルリクを構成するもの レビューとは

Slide 93

Slide 93 text

プルリクを構成するもの コードレビュー（英: Code review）は、ソフトウェア 開発工程で見過ごされた誤りを検出・修正することを 目的としてソースコードの体系的な検査（査読）を行う 作業のこと。 ref: https://ja.wikipedia.org/wiki/コードレビュー

Slide 94

Slide 94 text

プルリクを構成するもの 他の人からのレビューをもらうことで 考慮漏れに気づいたり コードの品質を高めたり することができます

Slide 95

Slide 95 text

閑話休題 -コードコメント-

Slide 96

Slide 96 text

閑話休題 皆さんこのツイートをご覧に なったことはありますか？

Slide 97

Slide 97 text

閑話休題 ref: https://twitter.com/t_wada/status/904916106153828352

Slide 98

Slide 98 text

閑話休題 ref: https://www.amazon.co.jp/dp/4873115655

Slide 99

Slide 99 text

閑話休題 動いているコードに対しては コメントなしで何をしているかわかる ことが理想だと思います

Slide 100

Slide 100 text

閑話休題 逆になぜこのやり方ではダメなのか をコメントで説明できると丁寧ですね

Slide 101

Slide 101 text

転

Slide 102

Slide 102 text

プルリクについての考え方 プルリク作成 レビュー 修正コミット マージ Approve プルリク 作成者 レビュアー

Slide 103

Slide 103 text

プルリクに ついての考え方 -プルリク編-

Slide 104

Slide 104 text

プルリクについての考え方 いいプルリクとは

Slide 105

Slide 105 text

プルリクについての考え方 意図がしっかりと説明されており レビュワーが理解しやすいもの

Slide 106

Slide 106 text

プルリクについての考え方 すぐにマージされるもの

Slide 107

Slide 107 text

こんな状態に なっていませんか？

Slide 108

Slide 108 text

プルリクの概要が よくわからない

Slide 109

Slide 109 text

プルリクの概要がよくわからない 自分で概要を書いていて、 どんなプルリクなのかすぐに書けない ことはありませんか？

Slide 110

Slide 110 text

プルリクの概要がよくわからない 一言でどんなプルリクなのか 言い表せない

Slide 111

Slide 111 text

プルリクの概要がよくわからない これは 複数のことを一つの コミットでやっている 可能性が高いです

Slide 112

Slide 112 text

プルリクの概要がよくわからない プルリクのスコープが明確でない 場合に起きがちです あと一歩、というところで手を止める勇気を持ちましょう

Slide 113

Slide 113 text

プルリクの概要がよくわからない initial commit→ プルリク作成（タイトル・概要記入）→ コード実装

Slide 114

Slide 114 text

プルリクの概要がよくわからない コードを書く際にコメントから書き始める手法のように はじめにどういうことをやる プルリクなのかを決めておく とブレずにいいかもしれません

Slide 115

Slide 115 text

コードを書いた 後で考慮漏れに 気づく

Slide 116

Slide 116 text

コードを書いた後で考慮漏れに気づく コードを書き終わって レビューの際に考慮漏れに 気づいて書き直し といったことがあるかもしれません

Slide 117

Slide 117 text

コードを書いた後で考慮漏れに気づく 先程もお伝えしたように、 飛び込む（＝コードを書く）前に考える ことが大事です

Slide 118

Slide 118 text

コードを書いた後で考慮漏れに気づく 僕はレビューは コード以外のことにも適用できる と思っています

Slide 119

Slide 119 text

コードを書いた後で考慮漏れに気づく 例えば事前に 実装方針や仕様を整理しておいて レビューをもらう ことで手戻りが自然と少なくなるでしょう

Slide 120

Slide 120 text

コードを書いた後で考慮漏れに気づく 極端な話 コードを書かなくても レビューはできます

Slide 121

Slide 121 text

コードを書いた後で考慮漏れに気づく 言葉で説明するのが難しい場合は WIPでコードを書いて 先にレビューをもらう （マージはしない）というやり方も良さそうです

Slide 122

Slide 122 text

プルリクに ついての考え方 -レビュー編-

Slide 123

Slide 123 text

プルリクについての考え方 お気づきかもしれませんが プルリクの段階ではまだ コードは世に出ていません

Slide 124

Slide 124 text

プルリクについての考え方 そういう意味では、プルリクは バリューの原石 だと言えるでしょう

Slide 125

Slide 125 text

プルリクについての考え方 率先してレビューすることで 一つでも多くのプルリクを早くマージ できるようにしていきたいですね

Slide 126

Slide 126 text

こんな状態に なっていませんか？

Slide 127

Slide 127 text

プルリクがずっと 放置されている

Slide 128

Slide 128 text

プルリクがずっと放置されている 食い気味にお願いして レビューしてもらいましょう…

Slide 129

Slide 129 text

コメントが少ない

Slide 130

Slide 130 text

コメントが少ない これは一概に悪いとは言えませんが… 完璧に説明がなされており 見ただけで即Approveできるものなど

Slide 131

Slide 131 text

コメントが少ない 例えば自分の場合だと 気になったことや気づいたこと、 わからないことなど 細かいことでもコメント するようにしています

Slide 132

Slide 132 text

コメントが少ない このあたりはレビューの文化を 根付かせることにも つながってきますが…

Slide 133

Slide 133 text

コメントが少ない

Slide 134

Slide 134 text

コメントが少ない レビューをされる相手も 同じ人間だということを忘れず、 心地よいコミュニケーション ができるといいですね

Slide 135

Slide 135 text

コードスタイルへの指 摘

Slide 136

Slide 136 text

コメントが少ない ひたすらつらいだけなので lint入れましょう

Slide 137

Slide 137 text

レビューするとき 気が重い

Slide 138

Slide 138 text

レビューするとき気が重い これは最近、個人的に 悩んでいたことです

Slide 139

Slide 139 text

レビューするとき気が重い 完璧にレビューしなきゃ！とか レビュー漏れでバグが混入したら どうしよう…とか

Slide 140

Slide 140 text

レビューするとき気が重い でも結局のところ 自分の力量を超える コードレビュー はできません

Slide 141

Slide 141 text

レビューするとき気が重い 今の自分にできる最良のレビュー ができればそれでいいのかなと思っています

Slide 142

Slide 142 text

閑話休題 -コードレビューについて-

Slide 143

Slide 143 text

閑話休題 コードレビューを取り入れれば 全てが万全の状態になるというわけではない… コードレビューにも限界はある と思っています

Slide 144

Slide 144 text

閑話休題 特にコードの外側、例えば 仕様やプロダクトの方向性など をコードレビューで見るのは レビューの範囲を超えてしまうのでつらいだけです

Slide 145

Slide 145 text

閑話休題 プロダクト・コードの 知見共有はペアプロ・モブプロ などを行うほうがよいと思います

Slide 146

Slide 146 text

閑話休題 この辺の考え方については こちらの記事 でより深く言及されています

Slide 147

Slide 147 text

閑話休題 モブプロについては過去に発表した資料 コミュニケーションから 始まるアジャイル をご覧ください

Slide 148

Slide 148 text

結

Slide 149

Slide 149 text

まとめ

Slide 150

Slide 150 text

まとめ プルリクは決して 怖いものではありません

Slide 151

Slide 151 text

まとめ プルリクを通して気持ちのいい コミュニケーションをしましょう

Slide 152

Slide 152 text

まとめ ただ、やり方については たった一つの正解はないと 思っていますので

Slide 153

Slide 153 text

まとめ 形にとらわれず、チームメンバー 全員が納得できる形に変えていく ことも大事かなと

Slide 154

Slide 154 text

まとめ プルリクと上手に 付き合っていくことで 生産性を高めていきましょう！

Slide 155

Slide 155 text

ご清聴ありがとう ございました