Gitブランチの基礎を学ぼう

ブランチとは複数の作業を並行して行う際などに、作業履歴を分岐させることが出来る機能です。

吉田先生

一番最初のコミットの時点で、「masterブランチ」もしくは「mainブランチ」というブランチが作成されます。

• ブランチとは
• トピックブランチを作成
• ブランチの切り替え
• マージ
• まとめ

ブランチとは

ブランチとは複数の作業を並行して行う際などに、作業履歴を分岐させることが出来る機能です。
一番最初のコミットの時点で、masterブランチというブランチが作成されます。（mainブランチの場合もあり）

そして、分岐させたい時に「トピックブランチ」と呼ばれるブランチを作成します。
たとえば、完成形はmasterブランチ、新機能の追加はトピックブランチA、修正はトピックブランチBというような形です。

ブランチでの作業は他のブランチには影響しません。また、トピックブランチを他のブランチに合流させることも出来ます。

トピックブランチを作成

ブランチを作成するには「git checkout -b」というコマンドを実行します。「-b」のあとにブランチの名前を記述します。

では、例としてお問い合わせフォームを作成するためのブランチ（contact-form）を作ってみましょう。

# 新しいブランチ（contact-form）を作成する

(master) $ git checkout -b contact-form

↓

Switched to a new branch 'contact-form'
(contact-form) $

「contact-form」というブランチが作成され、更にmasterブランチからcontact-formブランチに切り替わっていますね。

では、現在のブランチとブランチ一覧を確認するコマンドを実行してみましょう。
これは「git branch」と実行します。

(contact-form) $ git branch
* contact-form
  master

このように現在のブランチには「＊ (アスタリスク)」が付きます。

ブランチの切り替え

前セクションでブランチでの作業は他のブランチには影響を与えないとお話ししましたね。実際に確かめてみましょう。

例として、「contact-form」ブランチにて前レッスンで作成した「index.html」に変更を加えコミットしてみましょう。

変更前）index.html

<h1>zooloppa　ズーロッパ</h1>
<img src=”panda.jpg” alt=”panda”>

　↓

変更後）index.html

<h1>zooloppa　ズーロッパ</h1>
<img src=”panda.jpg” alt=”panda”>
<a href="#">お問い合わせフォームへ"></a>

この変更をコミットします。
以下のコマンドを実行して下さい。

# index.htmlをインデックスに追加する

(contact-form) $ git add index.html

# コミットする

(contact-form) $ git commit -m "Add contact to index"

では、masterブランチへと切り替えてみます。
切り替えるには「git checkout 〇〇」とします。「〇〇」の部分は切り替えたいブランチ名が入る場所です。

今回はmainブランチへの切り替えですので下記の様なコマンドになります。

# mainブランチへの切り替え

(contact-form) $ git checkout master
Switched to branch 'master'
 (master) $

masterブランチに切り替わりましたね。

「index.html」を見てみましょう。
追加したはずの<a href="#">お問い合わせフォームへ</a>がなくなっています。このように、他のブランチに影響を与えず編集していけるという事ですね。

マージ

続いて、ブランチを他のブランチにマージする方法を学んでいきましょう。
マージとはブランチを他のブランチに合流させることです。

たとえば、「contact-form」ブランチにてお問い合わせフォームを完成させたとします。
しかし、そのままではmainブランチ上にはお問い合わせフォームは反映されません。ですので、分岐させたcontact-formブランチをmasterブランチにマージする必要があります。

新たに「contact.html」というファイルを作成してコミットします。

１つ前のブランチに戻る為のコマンド「git checkout -」で、contact-formブランチに戻って作業します。

# １つ前のブランチに戻る

(master) $ git checkout -
  Switched to branch 'contact-form'

# htmlファイルの追加とコミット

(contact-form) $ touch contact.html
(contact-form) $ git add contact.html
(contact-form) $ git commit -m "Create contact.html"
[contact-form c9c1291] Create contact.html
 1 file changed, 0 insertions(+), 0 deletions(-)
 create mode 100644 contact.html

では、マージしてみましょう。

マージする場合、取り込む側のブランチで作業する必要があります。
今回は「master」ブランチに取り込みたいので「master」ブランチに移動します。

(contact-form) $ git checkout -
Switched to branch 'master'

そして、マージするためのコマンド「git merge」を実行します。
このコマンドの後に取り込まれる側のブランチ名を記述します。

# ブランチ（contact-form）をマージする

(master) $ git merge contact-form
Updating e36ac23..c9c1291
Fast-forward
 contact.html | 0
 index.html   | 3 ++-
 2 files changed, 2 insertions(+), 1 deletion(-)
 create mode 100644 contact.html

これでマージは完了です。

まとめ

作業履歴を枝分かれさせられる機能をブランチといいます。そして、枝分かれ先のブランチをトピックブランチといいます。

トピックブランチでの作業は他のブランチに影響を与えません。また、ブランチを他のブランチに合流させまとめることが出来ます。