git 勉強会

Git 勉強会～ GitHub が使えるようになり隊～

＠ kinmemodoki

2

キンメモドキ＠ kinmemodoki

そろそろ FPS やりたい

Who are you?

3参考資料

Git 講習 masawada 氏

http://sssslide.com/speakerdeck.com/masawada/gitjiang-xi-2014-dot-04-dot-15

Git チュートリアルhttps://www.atlassian.com/ja/git

4

本スライドで扱うコマンド一覧

　・ init ・ add 　・ commit ・ status

　・ log ・ reset

　・ branch ・ checkout

　・ merge ・ clone

　・ push ・ pull

はじめに

5What is git?

“Git” ってなんだろう

Git は、プログラムのソースコードなどの

変更履歴を記録・追跡するための

分散型バージョン管理システムである。

Wikipedia[git] ： http://ja.wikipedia.org/wiki/Git

Wikipedia より

6What is git?

プログラムの基礎っぽいところができたとき

次はチャット機能

を

追加しようかな

でもヘタに変えた

ら

動かなくなるかも

…

7What is git?

プログラムの基礎っぽいところができたとき

新しいディレクトリにコピーして編集しよう！！

8What is git?

どれが最新…？一個前のはどれ…？

9What is git?

ソースを特定の時期の状態にもどしたい…

10What is git?

チーム開発で最新ファイルの共有をしたい…

ソースコード編集して新機能追加しました

お前が編集したのは前バージョンのものだ！

11What is git?

そんな問題を解決！

12What is git?

• コードの状態を保存できる

• どの順番で更新していったかわかる

• チームでの開発だともっと便利

13

0. git の準備

14

Windows

1. http://git-scm.com/downloads からインストール

0. git の準備

2. Git Bash を起動

15

Mac

1. http://git-scm.com/downloads からインストール

0. git の準備

16

Mac2. pkg ファイルをインストール

3. sh ファイル（シェルスクリプト）使ってパス設定

0. git の準備

17

確認

「 git –version 」を入力し

version が表示されたら完了

0. git の準備

18

1. プログラミングをする前

19

$ git init <directory>


新しい作業ディレクトリ

.git フォルダを含む新規フォルダが作成される

＋

.git

20

$ git init


カレントディレクトリ .git

カレントフォルダに .git フォルダが作成される

＋

21

データの編集履歴の保存場所昔の状態に戻りたい時に参照


.git

リポジトリ

22

データの編集履歴の保存場所昔の状態に戻りたい時に参照


.git

リポジトリ

データベース的な感じ

23

2. コード編集後


作業ディレクトリ

編集履歴をリポジトリに保存する流れ

ワークツリーでファイルを追加 / 編集 / 削除



ステージングエリア


リポジトリに登録したいファイルを追加


作業ディレクトリリポジトリステージング

エリア


ステージングエリアのファイルをリポジトリに登録



エリア


add commit

28

[filename] をステージングエリアに登録

$ git add [filename]




add

29

作業ディレクトリ追加 / 変更されたファイルを add

$ git add .




add

30

作業ディレクトリ変更 / 削除されたファイルを add

$ git add -u




add

31

作業ディレクトリ追加 / 変更 / 削除されたファイルを add

$ git add -A




add

32

$ git commit

リポジトリステージングエリア

commit

登録されたファイルをリポジトリにすべて保存


33

commit 後のコメント入力（ vim ）


何の更新をしたかをコメント

34

$ git commit –m “comment”

リポジトリステージングエリア

commit

コメントをしつつコミット


35

$ git status

ファイルの add 状態を表示




36

リポジトリのログを表示

$ git log


リポジトリ log


リポジトリの “詳しい” ログを表示

コメント

日付

更新者

38

リポジトリの “短い” ログを表示

$ git log -oneline


リポジトリ log


リポジトリの “簡易的” ログを表示

コメント

Tips

40

41

What is staging?

ステージングエリアっている？

4242

ステージングエリアっている？

編集ファイル

リポジトリ

commit

What is staging?

4343

チャット機能＆履歴閲覧機能を実装したぞ！！

chat.js history.js

チャット機能を付けるために変更したファイル

What is staging?

4444

chat.js

リポジトリ

history.js

まとめてcommit

「 chat&history 機能つけました」

What is staging?

4545

リポジトリ log

3/14 「 chat と history 機能つけた」

3/12 「基本機能つけた」

New

Old

What is staging?

4646

その後…

history 機能でバグ発見

「 history 機能を実装し直しだ…」リセットしよう！

What is staging?

4747

リポジトリ log


3/12 「基本機能つけた」

イマココ

What is staging?

4848

リポジトリ log


3/12 「基本機能つけた」一個前

「 chat 機能も実装し直しじゃねーか…」

What is staging?

4949http://protectasapporo.blog.fc2.com/blog-entry-205.html

What is staging?

5050

なんてことになる前に！

http://protectasapporo.blog.fc2.com/blog-entry-205.html

What is staging?

5151

chat.js リポジトリ

history.js

commit

「 chat 機能つけました」

リポジトリ

commit

「 history 機能つけました」

commit はしっかり分けましょう

※ 分け方はいろいろ

commit したら history を編集

What is staging?

5252

チャット機能を commit する前にhistory.js 作っちゃったぞ！

history.js は消さなきゃダメ…？

What is staging?

5353


What is staging?

5454

commitchat.js

history.js

「 chat 機能つけました」

add

add しない

What is staging?

5555

commitchat.js

history.js

「 history 機能つけました」

add

What is staging?

5656

What is staging?


良い commit をするための整理場所

5757

Tips


エリア


add commit

58

git できるようになったこと

・リポジトリに登録できるようになった

おさらい

でてきたコマンド

・ git init 初期準備

・ git add 登録するファイルを選ぶ

・ git commit リポジトリへ登録

・ git status add 状態を表示

・ git log commit の履歴を表示

59

3. 巻き戻したいとき


間違えて add した！！

61

ステージングファイルの中身を消去

$ git reset


ステージングファイル


間違えて commit した！！

63

直前のコミットをキャンセルしてコミット

$ git commit --amend


新規コミット前コミット内容

64

前のコミットをキャンセルしてコミット

$ git commit --amend


新規コミット前コミット内容

上書き保存

65

指定したコミット以降のコミット履歴を消去

$ git reset --soft [commit]


指定コミット最新コミット

・・・


Tips ：コミットの指定方法

3/14 「 latest commit 」 ------> HEAD

3/12 「 3rd commit 」 ------> HEAD^

3/10 「 2nd commit 」 ------> HEAD^^

3/8 「 1st commit 」 ------> HEAD^^^

New

Old

67

$ git reset --soft HEAD^^


例

1st commitHEAD^^

2nd commitHEAD^

latest commitHEAD

68

コミット履歴を消去しつつコミット内容を作業ディレクトリに反映

$ git reset --hard [commit]


指定コミット作業

ディレクトリ最新コミット

・・・

69

$ git reset --hard HEAD^^


例

1st commitHEAD^^

2nd commitHEAD^

latest commitHEAD


70

4. 新機能を追加したいとき


ブランチbrunch枝


ブランチ（ branch ）

複数の機能を並行して作成するときに使用する

チャット機能

画像アップ機能

主機能commit

commit

73

$ git branch [name]

name

master

commit デフォルトは「 master 」

ブランチを新規作成


74

$ git checkout [name]

name

master

commit

編集中のブランチを変更


編集中

75

$ git merge [name]

name

master

commit

ブランチを統合


編集中

commit


ブランチの流れ

作成移行編集保存移行統合

master

commit

編集中



chat

master

commit


$ git brunch chat

編集中



chat

master

commit


$ git checkout chat

編集中



chat

master

commit


$ vim sample.java とか

編集中



chat

master

commit


$ git commit

編集中commit



chat

master

commit


$ git checkout master

編集中

commit



chat

master

commit


$ git merge chat

編集中

commit


コンフリクト（マージの衝突）


コンフリクト

同じファイルに違う編集をした状態でマージしたとき

TAKENOKO is GOD

KINOKO is GOD

主機能

commit

commit

commit

86

コンフリクトのエラー対処法

<<<<<<<HEADecho("TAKENOKO is GOD");=======echo("KINOKO is GOD");>>>>>>> kinoko

コンフリクト状態のファイルを編集してコミット


87


<<<<<<<HEADecho("TAKENOKO is GOD");=======echo("KINOKO is GOD");>>>>>>> kinoko


　　　　　　　消去


88


echo("TAKENOKO is GOD");


TAKENOKO is GOD


5. リモートでリポジトリを使う

89


ひとりでバージョン管理するには


みんなでバージョン管理するには

要：みんながアクセスできるリポジトリ

R


R リモートリポジトリ

それぞれの計算機にあるローカルなリポジトリとは別物の

共有リポジトリ


R リモートリポジトリ



エリア

add commit




エリア

add commit

R

pullpushリモート

リポジトリ

97

リモートリポジトリからローカルリポジトリを新規作成してコピー

＋リモートリポジトリの登録


$ git clone [URL]

R

98

URL ： GitHub のコピーしたいリポジトリの　　　右下を参照（ HTTPS の場合）


$ git clone [URL]

99

ローカルリポジトリ変更履歴をリモートリポジトリへアップロード


$ git push

R

100

リモートリポジトリ変更履歴をローカルリポジトリへダウンロード


$ git pull

R

101素材元

HUMAN PICTOGRAM 2.0

http://pictogram2.com/

git

http://git-scm.com/downloads/logos/

102

本スライドで扱ったコマンド一覧

　・ init ・ add 　・ commit ・ status

　・ log ・ reset

　・ branch ・ checkout

　・ merge ・ clone

　・ push ・ pull

おわりに

git 勉強会

Technology