GitHubワークショップ
@kodam/github-id:oppai
アジェンダ
• バージョン管理の基本 15分
• GitHub/Gitの基本てきな使い方 30分
• 応用編 15分
バージョン管理の基本
バージョン管理システムとは
• コンピュータ上で作成・編集したファイルの変
更履歴を管理するシステム
記録A
記録B
記録C 記録E
記録D 最新
バージョン管理システムとは
• 特にソフトウェア開発のソースコードの
管理に使われている
• バージョン管理システムにはCVS・SVN・
GITなどいろいろあるが、今回はGITにつ
いて取り扱う
バージョン管理システムとは
• ファイルの各バージョン情報をデータ
ベースで管理している
• このデータベースのことをリポジトリと
呼ぶ
バージョン管理システムとは
• 既存のバージョン管理システムでは、リ
ポジトリをサーバーのみに持つが、Gitで
はサーバーとクライアントの両方にリポ
ジトリを持っている。
バージョン管理システムとは
• サーバーのリポジトリをリモートリポジ
トリ、クライアントのリポジトリをロー
カルリポジトリと呼びます。
バージョン管理システムの基本操
作
リポジトリの管理者
リポジトリ
A B C D
A B C D
ローカル環境にリポジトリの
作成、ファイルの追加を行う
(initialize)
バージョン管理システムの基本操
作
リポジトリの管理者
リポジトリ
A B C D
A B C D
リモートリポジトリへリポジトリの差分のコピー(push)
リポジトリ
A B C D
バージョン管理システムの基本操
作
リポジトリ
A B C D
ユーザー
バージョン管理システムの基本操
作
リポジトリ
A B C D
A B C D
ローカル環境にリポジトリをコピー(clone)
リポジトリ
A B C D
ユーザー
バージョン管理システムの基本操
作
リポジトリ
A B C D
A B C D
リポジトリ
A B C D
ユーザー
E
バージョン管理システムの基本操
作
リポジトリ
A B C D
A B C D
リポジトリ
A B C D
ユーザー
E
ローカルリポジトリに変更を通知(commit)
E
バージョン管理システムの基本操
作
リポジトリ
A B C D
A B C D
リポジトリ
A B C D
ユーザー
E
リモートリポジトリへ差分をコピー(push)
EE
バージョン管理システムの基本操
作
リポジトリの管理者
リポジトリ
A B C D
A B C D
リポジトリ
A B C D E
バージョン管理システムの基本操
作
リポジトリの管理者
リポジトリ
A B C D
A B C D
リポジトリ
A B C D E
ローカルリポジトリへ差分をコピー(pull)
E
E
バージョン管理システムの基本操
作
リポジトリの管理者
リポジトリ
A B C D
A B C D
リポジトリ
A B C D E F
F
バージョン管理システムの基本操
作
リポジトリの管理者
リポジトリ
A B C D
A B C D
リポジトリ
A B C D E F
F
ローカルリポジトリへ差分をコピー(pull)
E
E
バージョン管理システムの基本操
作
リポジトリの管理者
リポジトリ
A B C D
A B C D
リポジトリ
A B C D E F
F
差分だけがうまくマージされる!便利!
E
E
バージョン管理システムの基本操
作
リポジトリの管理者
リポジトリ
A B C D
A B C D
リポジトリ
A B C D E F
F
E
E
リモートリポジトリへ差分をコピー(push)
F
バージョン管理システムとは
• Gitの基本操作
1. ローカルリポジトリの作成、ファイルを登録する
2. ローカルリポジトリをリモートへコピーする
3. 必要であれば、リモートリポジトリからローカル
へ差分をコピーする(プル)
4. ローカルリポジトリを編集する(コミット)
5. ローカルリポジトリの差分をリモートへコピーす
る(プッシュ)
2〜5を繰り返えす。
ブランチ
• 変更履歴の束をブランチと呼ぶ
• Gitはブランチを複数管理できる
記録A 記録B 記録C 記録E
記録D 記録F
Masterブランチ
バグ修正ブランチ
ブランチ
• 変更履歴の束をブランチと呼ぶ
• Gitはブランチを複数管理できる
記録A 記録B Masterブランチ
バグが発生!でも、Masterブランチには影響させたくない!
ブランチ
• 変更履歴の束をブランチと呼ぶ
• Gitはブランチを複数管理できる
記録A 記録B
記録D
Masterブランチ
バグフィックス用
ブランチ
ブランチを派生!(このことをブランチを切るという)
ブランチ
• 変更履歴の束をブランチと呼ぶ
• Gitはブランチを複数管理できる
記録A 記録B 記録C
記録D
Masterブランチ
バグフィックス用
ブランチ
ブランチ
• 変更履歴の束をブランチと呼ぶ
• Gitはブランチを複数管理できる
記録A 記録B 記録C 記録E
記録D 最新
Masterブランチ
バグフィックス用
ブランチ
ブランチ
• ブランチの切り方に明確なルールはない
– しかし、習慣的なものはある
– バグをまとめて管理したい時
– リリースと開発を分けたい時、等々
記録A 記録B 記録C 記録E
記録D 最新
Masterブランチ
バグフィックス用
ブランチ
ブランチ
• ブランチはマージすることができる
記録A 記録B 記録C 記録E
記録D 最新
Masterブランチ
バグフィックス用
ブランチ
ブランチ
• バグ修正用ブランチでバグ修正が終わったとき
記録A 記録B 記録C 記録E
記録D 記録F
バグ修正完了!
ブランチ
• マージすることでMasterのバグが修正される
– これによってマージされたブランチは削除される
記録A 記録B 記録C 記録E
記録D
修正完了!
記録F
記録G
ブランチ
• Gitはマージの他にリベースという機能がある
記録A 記録B 記録C 記録E
記録D 最新
Masterブランチ
バグフィックス用
ブランチ
ブランチ
• リベースはマージとは異なり、記録C、記録Eの変更を先
に適用する方法
– リベースはいろんな機能があるのでこれでは不十分
• イマイチ僕も理解してないので、自分で勉強してね(・ω<) てへぺろ
記録C 記録E
記録D 記録F
Masterブランチ
バグフィックス用
ブランチ
バージョン管理システムのメリッ
ト
• ソースコードを持ち歩く必要ない
– ソースコードを渡すときにZIPとかUSBメモリ
で渡す必要がない
– URLを教えれば、常に最新のソースコードを
渡すことが出来る
• バイナリやドキュメントも管理可能
バージョン管理システムのメリッ
ト
ダイレクトメール機能の実
装
つぶやき型SNSのリポジトリ
タイムラインの実装
フォロー機能の実装
お気に入り機能の実装
ユーザーの登録 最初のリビジョン
• 過去のバージョンに戻したり、組み合わせし直せる
– コミットのログをリビジョンという
最新のリビジョン
バージョン管理システムのメリッ
ト
• 過去のバージョンに戻したり、組み合わせし直せる
– 最新のリビジョンにバグがある例
ダイレクトメール機能の実
装
つぶやき型SNSのリポジトリ
タイムラインの実装
フォロー機能の実装
お気に入り機能の実装
ユーザーの登録
バージョン管理システムのメリッ
ト
ダイレクトメール機能の実
装
つぶやき型SNSのリポジトリ
タイムラインの実装
フォロー機能の実装
お気に入り機能の実装
ユーザーの登録
ここのリビジョンにアップデート可能
• 一つ前のリビジョンにやり直すことが出来る
– この作業の事し、コミットし直すことをロールバックという
バージョン管理システムのメリッ
ト
• 過去のバージョンに戻したり、組み合わせし直せる
– 必要な分だけマージすることが出来る
ダイレクトメール機能の実
装
つぶやき型SNSのリポジトリ
タイムラインの実装
フォロー機能の実装
お気に入り機能の実装
ユーザーの登録
ダイレクトメール機能の実
装
つぶやき型SNSのリポジトリ
タイムラインの実装
ユーザーの登録
バージョン管理システムのメリッ
ト
• 複数人でのファイル編集が可能
– モジュール単位で作業分担が可能
– プロジェクトのドキュメントのTeXを管理す
るときも便利
– ファイルの編集をコミットする時に、ローカ
ル環境が最新の常態でないとコンフリクト
(衝突)する
バージョン管理システムのメリッ
ト
• コンフリクトとは
– ローカルの環境が古い状態でコミットした場
合起こる現象
– 最新の状態にアップデートしてからコミット
することで回避出来る ユーザーA
ユーザーB
リポジトリ
A B C D
A B C D
A B C D
バージョン管理システムのメリッ
ト
• コンフリクトとは
– ローカルの環境が古い状態でコミットした場
合起こる現象
– 最新の状態にアップデートしてからコミット
することで回避出来る
ユーザーA
ユーザーB
リポジトリ
A B C D
A B C D
A B C D
E
F
バージョン管理システムのメリッ
ト
• コンフリクトとは
– ローカルの環境が古い状態でコミットした場
合起こる現象
– 最新の状態にアップデートしてからコミット
することで回避出来る ユーザーA
ユーザーB
リポジトリ
A B C D
A B C D
A B C D
E
F
コミット
E
バージョン管理システムのメリッ
ト
ユーザーA
ユーザーB
リポジトリ
A B C D A B C D
A B C D F
コミットするが、コンフリクトする
E E
橙色の部分が一緒じゃないので最新ではない
バージョン管理システムのメリッ
ト
ユーザーA
ユーザーB
リポジトリ
A B C D A B C D
A B C D
アップデート
E E
E
アップデートすると自動的に差分がマージされる
F
バージョン管理システムのメリッ
ト
ユーザーA
ユーザーB
リポジトリ
A B C D A B C D
A B C D
コミット
E E
E F
F
バージョン管理システムのメリッ
ト
• 絶対してはいけないこと!!
– よくやる人がいるので注意
ユーザーA
ユーザーB
リポジトリ
A B C D A B C D
A B C D F
コミットするが、コンフリクトする
E E
橙色の部分が一緒じゃないので最新ではない
バージョン管理システムのメリッ
ト
• 絶対してはいけないこと!!
– よくやる人がいるので注意
ユーザーA
ユーザーB
リポジトリ
A B C D A B C D
A B C D F
E E
作業ファイルを一時保存しておき、アップデートする
A B C D E
バージョン管理システムのメリッ
ト
• 絶対してはいけないこと!!
– よくやる人がいるので注意
ユーザーA
ユーザーB
リポジトリ
A B C D A B C D
A B C D F
E E
保存したファイルを上書きする
A B C D FE
バージョン管理システムのメリッ
ト
• 絶対してはいけないこと!!
– よくやる人がいるので注意
ユーザーA
ユーザーB
リポジトリ
A B C D A B C DE E
システムはEが無いの
で、削除したと判断 A B C D FE
バージョン管理システムのメリッ
ト
• 絶対してはいけないこと!!
– よくやる人がいるので注意
ユーザーA
ユーザーB
リポジトリ
A B C D E
A B C D FE
A B C D F
コミット
バージョン管理システムのメリッ
ト
• コミットする際には必ず差分を見よう!
Gitのメリット
• オフライン環境でもバージョン管理でき
る
• マージが超賢い(ラインマージ)
• コミットログを再編集することができる
– git-rebaseやgit-resetなど
• GitHubという強いバージョン管理インフ
ラがある
Gitのメリット
やっとここでGitHub!
やぁ
GitHubについて
• 無料でGitの(リモート)リポジトリが作れる
– 一部制約あり、学生には特典あり
• チケット管理システムやWikiがくっついて
る
• GitHubならではの機能が素晴らしい
– ForkやPullRequest
Octocat
Fork
• 他人の公開リポジトリを自分の公開リポ
ジトリとしてコピーする
– 自分のリポジトリのように編集できる
– 相手のリポジトリには影響がない
リポジトリ リポジトリ
PullRequest
• 自分の改良したブランチをマージしても
らう為のリクエスト
– OSS文化ではよくある形式
– 自分でバグフィックスしたブランチを送る
• 要はマージのリクエスト
リポジトリ リポジトリ
Pullしてください♡
PullRequest
• 自分の改良したブランチをマージしても
らう為のリクエスト
– OSS文化ではよくある形式
– 自分でバグフィックスしたブランチを送る
• 要はマージのリクエスト
リポジトリ リポジトリ
Pullしてください♡
クソコードなんかマージしねぇよ
GITHUBを使った実践GIT
Git入門
• このワークショップではWindows版の公式Gitクライアン
トを使っていることを想定
• 主にCUIのGitBashを使う
まだ入れてない人は大至急
– http://git-scm.com/downloads
アプリの起動
コンソール画面
(GitBash)
Git入門
• 今回の演習ではGitBashを中心に話をします
• Windowsで他のクライアントを使ってる人
• MacOSやLinux使ってる人、コマンドだけ把
握してください
Git入門
• WindowsのGitクライアントはGitBash以外に
もTortoiseGitなどあるので各自調べてね☆
Git入門
• まずは作業ディレクトリを作る
– $ mkdir techfun && cd techfun
• 作業ディレクトリの確認
– $ explorer .
Git入門
既存のリポジトリについて
• 既にリモートリポジトリがある場合
– $ git clone https://github.com/oppai/homo.sh
リポジトリを作ろう
• 初期化作業をする
リポジトリを作る
• 作業フォルダを作成・移動
– $ mkdir hello && cd hello
• 初期化作業をする
– $ git init
スクリーンショットはtechfunディレクトリの中で作業してるけど、
helloディレクトリだと思ってください><
変更の確認
• 今までの状態を確認をしてみる
– $ git status
ファイルの追加
• Hello.txtというファイルを追加しよう
変更の確認
• ステータスの確認
– $ git status
ファイルの追加
• リポジトリにHello.txtを追加することを通知(ステージ)
– $ git add Hello.txt
• 確認をしてみる
– $ git status
内容をリポジトリに反映
• ステージした内容をリポジトリに反映
– $ git commit –m “init and add hello.txt”
• なんか怒られた!
ユーザーの登録
• メールアドレスの登録
– $ git config --global user.email “your[at]email.com”
• ユーザー名の登録
– $ git config --global user.name “hoge”
内容をリポジトリに反映
• ステージした内容をリポジトリに反映
– $ git commit –m “init and add hello.txt”
• この作業をコミットと呼ぶ
変更の確認
• ステータス確認
– $ git status
• コミットログを確認
– $ git log
ここまでのまとめ
リポジトリ
リポジトリを初期化する
$ git init
ここまでのまとめ
リポジトリ
ファイルを作業フォルダに追加する
A
ここまでのまとめ
リポジトリ
ファイルのステージ
$ git add <file…> A
ファイルをコミット出来る状態にする
A
ここまでのまとめ
リポジトリ
変更のコミット
$ git commit –m “hogehoge”
A
変更をリポジトリに登録する
A
次の作業
• ローカルリポジトリをリモートリポジト
リへコピーする
リモートリポジトリの作成
• GitHubのDashboardを開く
リモートリポジトリの作成
• New Repositoryをクリック
リモートリポジトリの作成
• Repository nameはhelloにしてください
リモートリポジトリの作成
• 基本は書いている事そのまま
リモートリポジトリの作成
• 基本は書いている事そのまま
– $ git remote add origin your_url
– $ git push -u origin master
Githubのidとpassが要求される
リモートリポジトリの作成
• さっきのリポジトリのページを確認
ここまでのまとめ
• リモートリポジトリの作成(GitHubで作成)
• ローカルリポジトリをリモートリポジト
リへコピーする(push)
次の作業
• バグフィックス用のブランチを作り、
現行ブランチにPull Requestを送る
Pull Request
ブランチを作成
これ
ブランチを作成
• fix-01というブランチを作成する
ブランチを作成
• masterブランチとfix-01ブランチがある
ブランチを変更
• ブランチの確認
– *は現在見ているブランチ
– $ git branch –a
• 情報を取得
– $ git fetch
– $ git branch –a
ブランチを変更
• fix-01に使用するブランチを変更
– $ git checkout fix-01
– $ git branch –a
ファイルの更新
• README.mdファイルを作成
– マークダウン記法で書かれた説明書
– HTMLやCSSのようにGitHub上で見やすい
ファイルの更新
• 前回と同じように追加
– $ git add README.md
– $ git commit –m “add README.md”
• コミットログを確認
ファイルの更新
• もし間違ったコミットをしてしまった場合
– 一つ前のコミットに戻す
– $ git reset --soft HEAD^
• 作業ファイルを綺麗にしたい場合
– 最新のコミットの状態に戻す
– $ git reset --hard HEAD
ブランチの変更
• ブランチをmasterに切り替えてみる
– $ git checkout master
• ファイル構造が変わったのを確認
– README.mdが消える
– fix-01ブランチに戻しておこう
ブランチの変更
• ブランチがfix-01か確認
– $ git branch
– もし違っていたらcheckoutしてfix-01に切り替える
• リモートのfix-01にローカルのfix-01の変更をコピー
– $ git push origin fix-01
変更の確認
ここまでのまとめ
• ブランチを確認
– $ git branch [-a]
• ブランチの変更
– $ git checkout branch_name
• ローカルの変更をリモートへ適用
– $ git push origin branch_name
• コミットを1つ戻す
– $ git reset --soft HEAD^
PullRequestを送る
「バグ直したんでMasterにマージ
させてくださーーーい」
PullRequestを送る
• 今回は自分自身に出しているが、通常他
人のブランチに対して出す
「バグ直したんでMasterにマージ
させてくださーーーい」
PullRequestを送る
• これにより変更点のレビューや議論を
GitHub上で行い易くなっている
「バグ直したんでMasterにマージ
させてくださーーーい」
PullRequestを送る
PullRequestを送る
PullRequestを送る
PullRequestを送る
ちゃんと動くか確認しましょう!
ブランチのマージ
• ブランチがmasterか確認
– $ git branch
– もし違っていたらcheckoutしてmasterに切り替える
• リモートのfix-01の変更点をローカルのmasterにマージ
– $ git pull origin fix-01
ブランチのマージ
• ファイルが壊れていないか確認
PullRequestを処理
• このPullRequestは大丈夫そう!
PullRequestを処理
• GitHub上でマージして、コミットされた!
PullRequestを処理
• GitHub上でマージして、コミットされた!
Pull
Request
PullRequestを処理
• fix-01ブランチはもういらないから消す
PullRequestを処理
• Masterに変更が適用されてるか確認
PullRequestを処理
• ローカルでマージしたものを破棄
– $ git reset --hard HEAD^
• リモートサーバから新しく差分をコピーする
– $ git pull origin master
まとめ
• PullRequestを送る場合、専用ブランチを作成する
– Githubからでもコンソールからでも作成可能
– $ git checkout –b new_branch
– $ git push origin new_branch
• PullRequestを受け取ったらマージして動作確認する
– $ git pull target_url target_branch
• OKならマージをPush (Github上でマージ)
– $ git push origin main_branch
応用編
時間があれば
git-reset
• マニュアル便利
– $ man git-reset
• 広島Git勉強会 201306 - やりなおせるGit入門
– http://blog.eiel.info/blog/2013/06/02/hiroshima-git/
git-reflog
• [技術][Git]Git初心者が絶対に覚えておくべきコマンド
– http://d.hatena.ne.jp/idesaku/20091106/1257507849
• いざという時のためのgit reflog - Qiita [キータ]
– http://qiita.com/items/e37c707938847aee671b
Bitbucket
• Bitbucket
– https://bitbucket.org/
• 無料のプライベートリポジトリが無限に作れる!
• もちろん公開リポジトリも作成可能
• グループでの開発に人数規制がある
• 日本語にほとんど対応してる
• マジ優良サービス
.gitignore
• 管理対象外のファイルを指定できる
– .o,.swpなどのゴミファイルを管理対象外に
• 開発環境に合わせて、作成すると便利
– VisualStudioなら.objやbinフォルダなどを指定
• ググるとたくさん出てくるので参考に
マークダウン記法
• Markdown記法
– マークダウン記法をマスターするためのサイト・チートシー
ト・ツール。 http://bamka.info/3765/
• GithubではいろんなところでMarkdown記法を使う
• README.mdをMarkdownで書いておくとWebから見たと
きに綺麗に見れる
• その他にもレビューなどにも使える
• 最初はめんどくさいけど、覚えると便利
フォーク
• 他人のリポジトリをコピーして自分のリポジトリの様に
扱う機能
– GitHubの機能で、人のリポジトリはいじれないので一度フォー
クし、ブランチを切って、PullRequestを送るのが良い。
• フォーク元が削除されると一緒になって消える
Issue管理
• GitHubについてるチケット管理システム
– 詳しくはググって
Issue管理
Issue管理
Issue管理
• GitHubについてるチケット管理システム
– 詳しくはググって
• PullRequestもIssueとして管理される
– コミットコメントに#番号と付けるとそのIssueのコメ
ントとしてコミットが表示されるので便利
• $ git commit –m “#1 fix expressions”
もっと勉強したい
• Git公式(日本語)
– http://git-scm.com/book/ja/
• LearnGitBranching (ヤバイ)
– http://pcottle.github.io/learnGitBranching/
• サルでも分かるGit入門
– http://www.backlog.jp/git-guide/
• 自分でガンガン使うのが近道!
本日はお疲れ様でした

GitHubワークショップ