エイチームライフスタイルアドベントカレンダー2018の17日目は、株式会社エイチームブライズの@echaが担当します。

はじめに

デザイナのみなさん、Gitは得意ですか？
私はエイチームに入社して初めてGitに触れたのですが、ずっとデザイン1本（ちょっとだけマークアップ）でやってきた私にとって、あの黒い画面はなんだか怖いイメージでした。

先輩エンジニアに「ここが分かりやすいよ」と教えてもらったサルでも分かるGit入門さえ理解できず「私は猿以下・・・」と落ち込んだのですが、今回はそこからなんとかGitを人に教えられるところまできた私が考えた、デザイナ向けGitのしくみ解説を書きたいと思います。

目次

① Gitってなに？
② リモートとローカル
③ 魔法の言葉（pull・push）
④ まとめ

① Gitってなに？

まずはここです。そもそもGitとはなんなのか。
とりあえずGoogle先生に聞いてみます。

Git（ギット）は、プログラムのソースコードなどの変更履歴を記録・追跡するための分散型バージョン管理システムである。　引用：Wikipedia

ここで早くも、デザイナにとって馴染みのない単語が出てきましたので、まずはこの「バージョン管理」について私なりに説明します。

ざっくり言うと、バージョン管理とは
「複数人が同じサイトを同時に更新できるようにするためのしくみ」です。

チームでお仕事をしていると、1つのサイトを複数人で作ったり、更新したりすることが多くなります。

これを「今からトップページ編集するから誰も触らないでね！」「○○さん、お知らせページのファイル閉じて〜！」なんて声掛けしながら作業するのはとてもやりづらいですよね。

Git（バージョン管理）を使うと、なんとこの声掛けがいらなくなるんです。
どういう仕組みで声掛けがいらなくなるのか、次で説明します。

② リモートとローカル

Gitでは、複数人が同じサイトを同時に更新できるようにするために「リモート環境」と「ローカル環境」というものを使います。

それぞれの環境には、少しだけ内容が違う“かもしれない”同じサイトのデータが存在しています。

「リモート環境：オリジナルの世界（1つしかない）」
「ローカル環境：リモート環境のパラレルワールド（いくつもある）」
と考えると分かりやすいと思います。

では、Gitでこの「リモート環境」「ローカル環境」を使って、どうやって複数人で同じサイトを更新していくのか、次で説明します。

③ 魔法の言葉（pull・push）

Gitでは、リモート環境とローカル環境に対して魔法の言葉（pull・push）を使うことで、複数人で同じサイトを更新していきます。

ここからは分かりやすいように、サイトを「猿🐵」に見立てて説明します。

たとえば、上の図のような環境があったとします。

リモート環境：1匹の猿がいます
Aさんの環境：まだ何もいません
Bさんの環境：まだ何もいません

ある日、AさんとBさんは「猿を可愛くする」ミッションをもらったので、それぞれこう考えました。

Aさん「リボンをつけよう！」、Bさん「服を着せよう！」

ではさっそく、Gitで「魔法の言葉（pull・push）」を使い、下記の手順で猿を可愛くしていきましょう。

🐵 猿を可愛くする手順 🐵
1. 「pull」を使って猿の分身を連れてくる
2.  分身の猿にリボンをつける・服を着せる
3. 「push」を使ってオリジナルの猿に反映する

1. 「pull」を使って猿の分身を連れてくる

AさんとBさんの環境にはまだ猿がいないので、まずは「pull」を使って、それぞれの環境にオリジナルの猿の分身を連れてきます。

このように、リモート環境のデータをローカル環境にコピーしてくることを「pull」と言います。

2. 分身の猿にリボンをつける・服を着せる

連れてきた分身の猿に、Aさんはリボンを、Bさんは服を着せます。

AさんとBさんの環境にいる分身の猿が、ちょっとだけ可愛くなりました！

3. 「push」を使ってオリジナルの猿に反映する

AさんとBさんの環境にいる分身の猿は、ちょっとだけ可愛くなりましたが、これではまだ可愛さが足りません。

そこで「push」を使って、ちょっとずつ可愛くなった「分身の猿」をリモート環境にいる「オリジナルの猿」に合体させて、めっちゃ可愛くします。

オリジナルの猿がめっちゃ可愛くなりました！
ミッションコンプリートです！

このように、ローカル環境のデータをリモート環境に合体させることを「push」と言います。

※実際にはpullとpush以外にstatus、add、diff、commitなどのGitのコマンドを使うことになりますが、ここでは分かりやすいように省略しています。

④ まとめ

いかがでしたでしょうか？
Gitでは上記のように「リモート環境」「ローカル環境」「魔法の言葉（pull・push）」を使って、複数人が同じサイトを同時に更新できるようにしています。しくみを知ると、とても便利な素晴らしい機能ですね！

★ Git（バージョン管理）とは
「複数人が同じサイトを同時に更新できるようにするためのしくみ」

★ リモート環境・ローカル環境 とは
「Gitでバージョン管理を行うために使うしくみ」
リモート環境 → オリジナルの世界（1つしかないもの）
ローカル環境 → リモート環境のパラレルワールド（いくつもあるもの）

★ pull・push とは
「リモート環境とローカル環境に対して使う“魔法の言葉”」
pull → リモート環境から、ローカル環境にデータをコピーしてくる言葉
push → ローカル環境のデータをリモート環境に合体させる言葉

Gitには今回書いた以外にも、普段のお仕事の中でよく使う「ブランチ」などの機能があるので、そのあたりについてもまた機会があれば書きたいなと思います。

ここまで読んでくださり、ありがとうございました。
この記事を読むことで、Gitのあの黒い画面を怖く感じたり、「私は猿以下・・・」と落ち込んだりするデザイナが少しでも減ったら嬉しいです🐵

エイチームライフスタイルアドベントカレンダー2018、明日は@mgmgmに書いてもらう予定です。お楽しみに！

エイチームグループでは、一緒に働けるチャレンジ精神旺盛な仲間を募集しています。興味を持たれた方はぜひエイチームグループ採用サイトを御覧ください。
https://www.a-tm.co.jp/recruit/