テーマ: GitHubの機能を活用したGitHub Flowによる開発の進め方 内容: - GitHub Flowの概要 - GitHub Flowによる開発の流れ - GitHub FlowのためのGitHub機能の活用

1. takemikamiʼs note ‒ http://takemikami.com/
GitHubの機能を活⽤した
GitHub Flowによる開発の進め⽅
Copyright (C) Takeshi Mikami. All rights reserved. 1
三上 威 - @takemikami
アーリース情報技術株式会社 代表取締役 社⻑
2019.6.12

2. takemikamiʼs note ‒ http://takemikami.com/
はじめに
•テーマ
GitHubの機能を活⽤した
GitHub Flowによる開発の進め⽅
•内容
• GitHub Flowの概要
• GitHub Flowによる開発の流れ
• GitHub FlowのためのGitHub機能の活⽤
Copyright (C) Takeshi Mikami. All rights reserved. 2
本資料で説明する内容の概要を⽰します

3. takemikamiʼs note ‒ http://takemikami.com/
GitHub Flowの概要
Copyright (C) Takeshi Mikami. All rights reserved. 3

4. takemikamiʼs note ‒ http://takemikami.com/
GitHub Flowとは
• 次のフローで運⽤
• masterブランチは常にデプロイ可能な状態であること
• 開発を始める時は、masterからブランチを切り、開発内容がわかるようにブラン
チ名をつける
• ローカルPCの作業は、同じブランチ名でサーバ(GitHub)にpushする
• 意⾒を求めたり、教えて欲しいことがある場合は、Pull Requestを使う
• 開発ブランチは、誰かにレビューを依頼して承認をもらったら、masterにマージ
できる
• masterにマージしたら、直ちにデプロイする
Copyright (C) Takeshi Mikami. All rights reserved. 4
GitHub Flowの概要
GitHub Flowを紹介します
「シンプルさ」に特徴がある
Gitによる開発ワークフローのモデル

5. takemikamiʼs note ‒ http://takemikami.com/
GitHub Flowのブランチモデル
• GitHub Flowのブランチモデルは以下のようになります
Copyright (C) Takeshi Mikami. All rights reserved. 5
GitHub Flowの概要
GitHub Flowのブランチモデルを⽰します
commit
branch
branch
commit
merge
merge
(rebase) merge
commit
master branch
descriptive branch
descriptive branch
開発を始める時は
masterからブランチを切る
masterにマージしたら
直ちにデプロイ
レビュー承認をもらったら
masterにマージできる
masterは常に
デプロイ可能な状態に
開発中はPullRequestを使って相談

6. takemikamiʼs note ‒ http://takemikami.com/
GitHub Flowによる開発の流れ
Copyright (C) Takeshi Mikami. All rights reserved. 6

7. takemikamiʼs note ‒ http://takemikami.com/
GitHub Flowによる開発の流れ
• GitHub Flowでは、次の流れで開発を⾏います
• 開発の着⼿
• ローカルPCでの実装作業
• GitHubへのpush
• Pull Requestの発⾏
• Pull Requestのステータス確認
• Reviewの依頼
• Reviewの実施・承認
• 不具合や指摘事項の対応
• Mergeの実施
• デプロイ
Copyright (C) Takeshi Mikami. All rights reserved. 7
GitHub Flowによる開発の流れ
GitHub Flowによる開発の流れを⽰します

8. takemikamiʼs note ‒ http://takemikami.com/
GitHub FlowとCI・レビュー・デプロイの関連
Copyright (C) Takeshi Mikami. All rights reserved. 8
GitHub Flowによる開発の流れ
GitHub FlowとCI・レビュー・デプロイの関連を図に⽰します
Developer GitHub Reviewer CI
development
environment
staging
environment
clone/pull (master branch)
branch
commit
push (descriptive branch)
clone
send status(OK/NG)
auto test
deploy
review request
check check
approve
merge deploy
pull request

9. takemikamiʼs note ‒ http://takemikami.com/
開発の流れ：開発の着⼿
Copyright (C) Takeshi Mikami. All rights reserved. 9
GitHub Flowによる開発の流れ
開発を着⼿する際に⾏う⼿続きを説明します
Developer GitHub Reviewer CI
development
environment
staging
environment
clone/pull (master branch)
branch
commit
push (descriptive branch)
clone
send status(OK/NG)
auto test
deploy
review request
check check
approve
merge deploy
pull request
開発着⼿時は、
masterブランチをGitHubからローカルPCに取り込み、
ブランチを切ります

10. takemikamiʼs note ‒ http://takemikami.com/
開発の流れ：開発の着⼿
• ローカルPCにrepositoryをcloneします
Copyright (C) Takeshi Mikami. All rights reserved. 10
GitHub Flowによる開発の流れ
開発を着⼿する際に⾏う⼿続きを説明します
$ git clone git@github.com:<organization>/<repository>.git
$ cd <repository>

11. takemikamiʼs note ‒ http://takemikami.com/
開発の流れ：開発の着⼿
• masterから開発作業⽤のブランチを切ります
• ローカルPCのブランチは以下のようになります
Copyright (C) Takeshi Mikami. All rights reserved. 11
GitHub Flowによる開発の流れ
開発を着⼿する際に⾏う⼿続きを説明します
$ git checkout -b fix-something
$ git branch
* fix-something
master
ブランチ名は、開発する内容を⽰す適当な名称にします

12. takemikamiʼs note ‒ http://takemikami.com/
開発の流れ：ローカルPCでの実装作業
Copyright (C) Takeshi Mikami. All rights reserved. 12
GitHub Flowによる開発の流れ
ローカルPCでの実装作業を⾏う際の⼿続きを説明します
Developer GitHub Reviewer CI
development
environment
staging
environment
clone/pull (master branch)
branch
commit
push (descriptive branch)
clone
send status(OK/NG)
auto test
deploy
review request
check check
approve
merge deploy
pull request
ファイルを修正し
開発作業⽤のブランチにcommitします

13. takemikamiʼs note ‒ http://takemikami.com/
開発の流れ：ローカルPCでの実装作業
• ローカルPC上でファイルを変更し、commitします
Copyright (C) Takeshi Mikami. All rights reserved. 13
GitHub Flowによる開発の流れ
ローカルPCでの実装作業を⾏う際の⼿続きを説明します
$ git commit <file> -m <comment>

14. takemikamiʼs note ‒ http://takemikami.com/
開発の流れ：GitHubへのpush
Copyright (C) Takeshi Mikami. All rights reserved. 14
GitHub Flowによる開発の流れ
GitHubへpushする際の⼿続きを説明します
Developer GitHub Reviewer CI
development
environment
staging
environment
clone/pull (master branch)
branch
commit
push (descriptive branch)
clone
send status(OK/NG)
auto test
deploy
review request
check check
approve
merge deploy
pull request
開発作業⽤のブランチを
GitHubにpushします

15. takemikamiʼs note ‒ http://takemikami.com/
開発の流れ：GitHubへのpush
• ファイルの変更&commitを⾏ったら、変更をGitHubにpushします
Copyright (C) Takeshi Mikami. All rights reserved. 15
GitHub Flowによる開発の流れ
GitHubへpushする際の⼿続きを説明します
$ git push origin fix-something
GitHubにブランチが作成されます

16. takemikamiʼs note ‒ http://takemikami.com/
開発の流れ：Pull Requestの発⾏
Copyright (C) Takeshi Mikami. All rights reserved. 16
GitHub Flowによる開発の流れ
GitHubでPull Requestを作成する際の⼿続きを説明します
Developer GitHub Reviewer CI
development
environment
staging
environment
clone/pull (master branch)
branch
commit
push (descriptive branch)
clone
send status(OK/NG)
auto test
deploy
review request
check check
approve
merge deploy
pull request
GitHubでPull Requestを作成します

17. takemikamiʼs note ‒ http://takemikami.com/
開発の流れ：Pull Requestの発⾏
Copyright (C) Takeshi Mikami. All rights reserved. 17
GitHub Flowによる開発の流れ
GitHubでPull Requestを作成する際の⼿続きを説明します
• GitHubのUIからPull Requestを作成します

18. takemikamiʼs note ‒ http://takemikami.com/
開発の流れ：Pull Requestのステータス確認
Copyright (C) Takeshi Mikami. All rights reserved. 18
GitHub Flowによる開発の流れ
GitHubでPull Requestのステータスを確認する際の⼿続きを説明します
Developer GitHub Reviewer CI
development
environment
staging
environment
clone/pull (master branch)
branch
commit
push (descriptive branch)
clone
send status(OK/NG)
auto test
deploy
review request
check check
approve
merge deploy
pull request
Pull Requestの⽣成後、⾃動的に、
CIによるテスト・開発環境へのデプロイを
⾏うようにしておきます
必要に応じて
Pull Requestのコメント機能を使い、
開発に関する相談を⾏います

19. takemikamiʼs note ‒ http://takemikami.com/
開発の流れ：Pull Requestのステータス確認
• CIサービスとの連携で、Pull Requestからテスト結果を確認できます
• 全てのcheckがpassedになるまでコードの修正を⾏います
Copyright (C) Takeshi Mikami. All rights reserved. 19
GitHub Flowによる開発の流れ
GitHubでPull Requestのステータスを確認する際の⼿続きを説明します
※Deployment APIを利⽤するとデプロイの状況も確認できます

20. takemikamiʼs note ‒ http://takemikami.com/
開発の流れ：Reviewの依頼
Copyright (C) Takeshi Mikami. All rights reserved. 20
GitHub Flowによる開発の流れ
GitHubでReviewを依頼する際の⼿続きを説明します
Developer GitHub Reviewer CI
development
environment
staging
environment
clone/pull (master branch)
branch
commit
push (descriptive branch)
clone
send status(OK/NG)
auto test
deploy
review request
check check
approve
merge deploy
pull request
⾃動テスト・セルフレビュー・動作確認が
完了したらReviewを依頼します

21. takemikamiʼs note ‒ http://takemikami.com/
開発の流れ：Reviewの依頼
• ⾃動テスト・セルフレビュー・動作確認が完了したら、
GitHubのUIからReviewを依頼します
Copyright (C) Takeshi Mikami. All rights reserved. 21
GitHub Flowによる開発の流れ
GitHubでReviewを依頼する際の⼿続きを説明します

22. takemikamiʼs note ‒ http://takemikami.com/
開発の流れ：Reviewの実施・承認
Copyright (C) Takeshi Mikami. All rights reserved. 22
GitHub Flowによる開発の流れ
GitHubでReviewを実施する際の⼿続きを説明します
Developer GitHub Reviewer CI
development
environment
staging
environment
clone/pull (master branch)
branch
commit
push (descriptive branch)
clone
send status(OK/NG)
auto test
deploy
review request
check check
approve
merge deploy
pull request
Reviewerは
コード差分・開発環境のモジュールを参照して
レビューを⾏います
問題なければApproveします

23. takemikamiʼs note ‒ http://takemikami.com/
開発の流れ：Reviewの実施・承認
• ReviewerはGitHubのUIから、コメントやApproveを⾏います
Copyright (C) Takeshi Mikami. All rights reserved. 23
GitHub Flowによる開発の流れ
GitHubでReviewを実施する際の⼿続きを説明します

24. takemikamiʼs note ‒ http://takemikami.com/
開発の流れ：不具合や指摘事項の対応
• テストやレビューで検出した不具合や指摘事項は、
修正してcommit/pushを⾏います
→「ローカルPCでの実装作業」〜「GitHubへのpush」と同じ⼿続き
Copyright (C) Takeshi Mikami. All rights reserved. 24
GitHub Flowによる開発の流れ
不具合や指摘事項の対応する際の⼿続きを説明します

25. takemikamiʼs note ‒ http://takemikami.com/
開発の流れ：不具合や指摘事項の対応
• masterブランチに変更があった場合は、以下のように追従します
• ローカルPCのmasterブランチを最新化します
• 開発作業⽤ブランチをmasterからrebaseします
• conflictが無ければ、GitHubにforce pushします
Copyright (C) Takeshi Mikami. All rights reserved. 25
GitHub Flowによる開発の流れ
不具合や指摘事項の対応する際の⼿続きを説明します
$ git checkout master
$ git pull
$ git checkout fix-something
$ git rebase master
$ git push origin fix-something -f

26. takemikamiʼs note ‒ http://takemikami.com/
開発の流れ：不具合や指摘事項の対応
• rebase時にconflictが発⽣した場合は、以下のように解消させます
• conflictが発⽣すると以下のように表⽰されます
• conflictしているファイルを修正した後、rebaseをcontinueします
Copyright (C) Takeshi Mikami. All rights reserved. 26
GitHub Flowによる開発の流れ
不具合や指摘事項の対応する際の⼿続きを説明します
$ git rebase master
※省略※
CONFLICT (content): Merge conflict in README.md
※省略※
$ git st
※省略※
both modified: README.md
※省略※
$ git add README.md
$ git rebase --continue

27. takemikamiʼs note ‒ http://takemikami.com/
開発の流れ：Mergeの実施
Copyright (C) Takeshi Mikami. All rights reserved. 27
GitHub Flowによる開発の流れ
GitHubでmasterへのMergeを⾏う際の⼿続きを説明します
Developer GitHub Reviewer CI
development
environment
staging
environment
clone/pull (master branch)
branch
commit
push (descriptive branch)
clone
send status(OK/NG)
auto test
deploy
review request
check check
approve
merge deploy
pull request
テスト・レビューで問題が無くなったら
(=本番deploy可能な状態になったら)、
masterブランチにmergeします

28. takemikamiʼs note ‒ http://takemikami.com/
開発の流れ：Mergeの実施
• GitHubのUIからMergeを⾏います
Copyright (C) Takeshi Mikami. All rights reserved. 28
GitHub Flowによる開発の流れ
GitHubでmasterへのMergeを⾏う際の⼿続きを説明します

29. takemikamiʼs note ‒ http://takemikami.com/
開発の流れ：デプロイ
Copyright (C) Takeshi Mikami. All rights reserved. 29
GitHub Flowによる開発の流れ
デプロイを⾏う際の⼿続きを説明します
Developer GitHub Reviewer CI
development
environment
staging
environment
clone/pull (master branch)
branch
commit
push (descriptive branch)
clone
send status(OK/NG)
auto test
deploy
review request
check check
approve
merge deploy
pull request
masterブランチにmergeしたら、
⾃動でstaging環境にdeployします

30. takemikamiʼs note ‒ http://takemikami.com/
GitHub FlowのためのGitHub機能の活⽤
Copyright (C) Takeshi Mikami. All rights reserved. 30

31. takemikamiʼs note ‒ http://takemikami.com/
GitHub FlowのためのGitHub機能の活⽤
• GitHub Flowを効率よく運⽤するためのGitHub機能を紹介します
• Pull Request機能
→masterブランチへのmergeする前の承認ワークフローとして使⽤
• BranchのProtect機能
→ステータス正常＆レビュー済みPull Request以外からの変更を禁⽌し、
masterブランチを常にデプロイ可能な状態に保つために使⽤
• CIとの連携機能
→Pull Requestの⽣成後のテスト実⾏を⾃動化するために使⽤
• CDとの連携機能
→開発環境・本番環境へのデプロイを⾃動化するために使⽤
Copyright (C) Takeshi Mikami. All rights reserved. 31
GitHub FlowのためのGitHub機能の活⽤
GitHub Flowを効率よく運⽤するためのGitHub機能を紹介します

32. takemikamiʼs note ‒ http://takemikami.com/
開発の流れ：Pull Requestのステータス確認
• CIサービスとの連携で、Pull Requestからテスト結果を確認できます
• 全てのcheckがpassedになるまでコードの修正を⾏います
Copyright (C) Takeshi Mikami. All rights reserved. 32
GitHub FlowのためのGitHub機能の活⽤
GitHubでPull Requestのステータスを確認する際の⼿続きを説明します
※Deployment APIを利⽤するとデプロイの状況も確認できます
CIとの連携機能によって、
テスト結果をステータスに反映
BranchのProtect機能によって、
ステータス正常＆レビュー済みで無ければ、
Merge出来ないように制御

33. takemikamiʼs note ‒ http://takemikami.com/
BranchのProtect機能
• GitHub Flowでは
『masterブランチは常にデプロイ可能な状態であること』が必要
→ masterブランチに誤った修正が⼊らないようにしたい
• BranchのProtect機能で以下のような条件を設定
• レビューを必須にする
• codeownerを設定しておくと、指定レビューアのレビューを必須に出来る
• CIの成功を必須にする
• 「Require status checks to pass before merging」以下で対象とするCIを指定可能
• Pull Requestをマージできる⼈を制限する
Copyright (C) Takeshi Mikami. All rights reserved. 33
GitHub FlowのためのGitHub機能の活⽤
BranchのProtect機能で設定したい項⽬について⽰します