hiyoko-programingの日記

プログラミングを勉強したてのひよっ子。   エンジニア目指して勉強中。

GitHub Desktop

GitHub Desktopをインストール

GitHub Desktop

GitHubが提供しているデスクトップ用のアプリケーション。本来はコンソールで実施する作業を、グラフィカルに表現してくれるので、GitHubを利用した開発をより容易にしてくれる。これらのツールはGUI(グラフィカル・ユーザー・インターフェース)と呼ばれていまる。一方、CUI(キャラクター・ユーザー・インターフェース)と呼ばれるものもあり、これらは文字だけで操作する。つまりGitの操作においては、CUIがコンソールでの操作、GUIGitHub Desktopでの操作、と捉えることができる。

GitHub Desktopをインストールし

まずは以下のリンクから、GitHub Desktopをインストールしましょう。
Mac版GitHub Desktopのダウンロードリンク

GitHub Desktop | Simple collaboration from your desktop

ダウンロードしたzipファイルを展開すると出てくる「GitHub Desktop」を
アプリケーションフォルダに移動。

GitHub Desktop配置

GitHub Desktopの初期設定を行う

GitHub Desktopを起動する。初回起動時には以下のような画面が表示される。まずは、リモートリポジトリを確認できるようにするためにGitHubへログイン。

GitHub Desktop初回起動

Sign in to GitHub.com」をクリック。GitHubログイン情報入力画面に遷移する。

GitHubログイン情報入力画面

ログイン情報を入力すると、次にローカルでGitを扱う際の情報を入力する画面に遷移する。こちらで入力した情報が、リモートリポジトリに変更を送った際に送り主として表示される。
特にGitHubアカウント情報と分ける必要はないので、名前とメールアドレスをログイン時と同様に入力する。

ローカル情報入力画面

次に、利用状況を送信するかの確認画面に遷移する。こちらについてはどちらでも構わないが、特に送信する必要はないので、チェックを外しておく。

利用状況送信確認

以上が完了すると、GitHub Desktopの開始画面に遷移する。

GitHub Desktop開始画面

ローカルリポジトリGitHub Desktopで扱う

sampleディレクトリをGitHub Desktopで取り扱えるようにする

それではログインが完了したので、実際にローカルリポジトリGitHub Desktopに追加していく。

ローカルリポジトリを追加

既に存在するローカルリポジトリを追加するので、こちらをクリック。

https://tech-master.s3.amazonaws.com/uploads/curriculums//bf87624b502bcb8bbd2692e9766123c4.png

続いて、sampleディレクトリを選択し、追加。

https://tech-master.s3.amazonaws.com/uploads/curriculums//a4ce5307f5f1a6b6b66d3f6ef3200123.png

すると以下のような画面になるはず。ここでHistoryを確認すると、過去のコミットが全て記録に残っていることが確認できる。

https://tech-master.s3.amazonaws.com/uploads/curriculums//994aa41519af5d48f7bb6d23be5d21bd.png

GitHub Desktopでコミットしてプッシュする

それでは変更修正→コミット→プッシュまでの一連の流れを、GitHub Desktopを用いて行う。

変更修正を加える

sample/sample.rb
1
2
3
4
5
def hello
  p "hello, GitHub Desktop."
end

hello

コミットしてプッシュ

修正を加えたらGitHub Desktopのchangesの欄をみてみる。

https://tech-master.s3.amazonaws.com/uploads/curriculums//b3be1348e0b41f669b51e91d7e24ae50.png

以下のように先程の変更修正が上がっているはず。

https://tech-master.s3.amazonaws.com/uploads/curriculums//1e1724f37f5014822870d91a0d6be21b.png

ここで各項目の左側にチェックボックスがある。こちらはチェックするとインデックスに追加されている変更修正、チェックが外れているとインデックスには追加されていない変更修正、とすることができる。すなわちこのチェックボックスgit addの概念を表している。

以下のようにコミットメッセージを記入して、コミットする。なお、Descriptionにはコミットメッセージだけでは表現しきれない、より詳細な内容を記入することができる。

https://tech-master.s3.amazonaws.com/uploads/curriculums//3e12b1621a61442926384d1f435f46f9.png

コミットをしたら、右上のPublish branchをクリック。これがプッシュにあたる。

https://tech-master.s3.amazonaws.com/uploads/curriculums//5e762eac81060fe4fa6eaecee4fa8beb.png

一度プッシュすると、[Publish branch]ボタンが[Fetch origin]ボタンに変わる。GitHub Desktopでは、1回目のプッシュのときはPublish branchと表示され、2回目以降のプッシュはFetch originと表示が切り替わる。プッシュを行うという機能自体は変わりないので、気にする必要はない。

ブラウザで確認

https://tech-master.s3.amazonaws.com/uploads/curriculums//9b1bd473d04fe9e3595d167b9d68baef.png

上記のコミットが確認できれば、GitHub Desktopでの操作は正しく行えている。