こんにちは、えびかずきです！
プログラミング学習や開発でWebでの情報を参考にしていると、サンプルコードのダウンロード先として以下の様なページに飛ばされることはないでしょうか？
そして、とりあえずファイルをダウンロードするために「Download」ボタンをポチッと押す。。。
実はこれ、Github（ギットハブ）という開発者向けのデータ共有サービスなのです！
今回はこのサービスを使いこなすためにGit・Githubの始め方について説明したいと思います。
是非使ってみましょう！
GitとGithubの違い
バージョン管理ツールの実体 
Gitリポジトリを共有できるウェブサービス
まず、第一に説明しておくべきことは、「Git（ギット）」と「Github（ギットハブ）」とは一体何なのかということです。
「Git」「Github」は下に説明するとおり別物です。
Gitとは
「Git」とはバージョン管理ツールの実体です。
そもそもはソースコードを編集するプログラマー向けに設計されたファイル管理ツールで、無料で使用することができます。
自分のPCにインストール（Macの場合はデフォルトで搭載）して使用することで、ファイルを管理をするリポジトリを作成することができます。
言葉だけだとちょっとわかりづらいですが、下の絵の通りファイルのバージョン管理やファイルの併合（マージ）が容易になります。
Gitはテキスト形式のファイルだけでなく、エクセルやワードなどのファイルのバージョン管理へも使用することが可能です。マージは難しくなりますがファイル拡張子に関わらずバージョン管理は実行することができます。
Githubとは
Github（ギットハブ）とは、Gitで管理しているローカルのGitリポジトリをWeb上で共有するためのサービスで、Gitと同様に無料で利用することができます。
（最近非公開のリポジトリも無料で利用できるようになりました。）
主にチームで開発を進める人向けの共有サービスとして設定されています。
個人で使用する場合にもバックアップやリモートアクセスを目的としたクラウド利用としても活用に便利です。
さらに、世界中の開発者の公開コードを閲覧したり、コードのやり取りをすることができ、コミュニケーションツールとしても活用することができます。
Gitの始め方（Sourcetreeを利用）
それでは、実際にGitをインストールして使ってみましょう。
Gitはコマンドラインツールからアクセスして利用することができますが、今回はコマンドを覚えなくても視覚的にGitを利用できるSourceTreeというGUIソフトを使用する方法について説明していきたいと思います。
①Sourcetreeのダウンロード
まずSourcetreeをATLASSIAN公式ダウンロードページからダウンロードします。
・Mac版かWin版のいずれかを選択。(今回はMacで説明します)
・Downloadをクリック。
するとローカルのダウンロードフォルダに「Sourcetree.app」が保存されます。
・これをダブルクリックで開く。
・開くをクリック。
②Sourcetreeのインストール
続いてインストール作業に移ります。
Sourcetreeを使用するには、Atlassian製品のBitbucket（Githubのような共有サービス）への登録が必要になります。今回は使わないですがSourcetreeを使用させてもらうために登録します。
・Bitbucketクラウドをクリック。
・GoogleアカウントでBitbucket（新規の個別登録やMicrosoftアカウントでも可）へログインする。
Bitbucketに続いて、Bitbucketクラウドへログインする。
・Get startedをクリック。
・メールアドレスを入力→続行→Atlassianアカウントでサインアップ
・Continue with Googleをクリック。
・ユーザー名を入力→続行→スキップ（アンケートはスキップ可）
・続行→完了
これでSourcetreeインストールは完了です！
アプリを開くと下の様なSorcetree画面が表示されるようになります。
意外と面倒でしたね。。
※二回目以降Sourcetreeを開くと下の様なメッセージが出る。appをアプリケーションフォルダに移すために「Move to Applications Folder」をクリックする。
ダウンロードフォルダに残ったappファイルは消してOK。
Gitでファイルを管理してみる
それでは実際にGitを使ってみましょう。
今回はデスクトップに新規フォルダを作成して、Gitのローカルリポジトリとしてみましょう。
ローカルリポジトリの作成
①デスクトップに新規フォルダを作成し、txtファイルを保存する。
txtファイルの中身はなんでもOK。(今回は”aaa”)
②Sourcetreeを開いて、ファイル→新規をクリック。
②ローカルリポジトリを作成をクリック。
※Sourcetree画面へフォルダをドラッグ&ドロップする方法でもOK。
③保存先のパスに先ほど作成したデスクトップのフォルダを指定する。
名前はフォルダと同じでOK、タイプはGitを選択。
すると”test”という新しいリポジトリが生成される。
Gitリポジトリになると、ファルダ内に.gitというファイルが生成される。
※Macの場合、command+Shift+.で隠しファイル表示
バージョン管理（コミットのやり方）
Gitでは”コミット”という操作を加えることによって、ファイルのバージョンをリポジトリに保管することができます。
ここではそのコミットの方法について説明します。
①Sourcetreeからローカルリポジトリを開く。
②下図のように対象のファイルをステージへ移動させた後に左上のコミットをクリック。
③コメントを入力。
これでコミットが完了し、リポジトリに最初に作ったバージョンを保管することができました。
ファイルを編集した時
①txtファイルを下のように、変更（二行目に”bbb”を追加）して保存します。
すると変更が加わるとSourcetreeがそれを検出して、下のような画面になる。
②最初のファイルでやったのと同じように、ステージへ移動→コミットをクリック。
③コメントを入力。
これでOKです！
履歴を確認すると、変更履歴がリポジトリに保管されていることが確認できます。
この状態にしておけば、いつでもコミットで履歴を残した状態に戻ることができます。
過去の状態に戻りたい場合は、対象の履歴へチェックアウト（ダブルクリックしてOKを押すだけ）します。
これでいつでも過去のファイルに戻れますね！
Githubのアカウント作成
さあ、いよいよGithubです。
まずは、Github公式ページから利用登録をしてください。
Githubへプッシュ（アップロード）する
Githubにリポジトリを作成する
①Githubにサインインして、ホーム画面左上の「New」をクリックする。
②必要事項を入力する。
リポジトリの名前を入力（なんでもOK）し、公開/非公開を選びます。（今回は公開としました。）
SourcetreeとGithubを繋ぐ
①Sourcetreeの「Sourcetree」→「環境設定」→「アカウント」→「追加」からアカウント登録画面を開く。
②下図のようにGithubのアカウントで登録する。
アカウントを接続をクリックすると、自動的にGithubの認証画面が立ち上がるので許可する。
③保存をクリック。
Sourcetreeでリモートリポジトリ（Github）のパスを追加する
ここでは、プッシュ先としてGithubのリポジトリを登録します。
①設定→リモート→追加から、パスの追加画面を開く。
②下図のように必要情報を入力する。
リモートの名前はなんでもOKですが、Githubで作成したリポジトリ名をそのまま入れるのをお勧めします。
URL/パスは、ブラウザから対象となるGithubのリポジトリの画面から取得します。
上のようなパスのコピーBOXが準備されているので、HTTPを指定して右端のボタンをクリックしてパスをコピーし、Sourcetreeの設定画面へペーストします。
Githubへプッシュする
①Sourcetreeの「履歴」画面から、左上にあるプッシュをクリック。
②プッシュ先のリポジトリとプッシュする項目を選択して、OKをクリックする。
これでpush完了です！
Githubからリポジトリの内部を確認すると、ローカルリポジトリと同じものが複製されていることが確認できると思います。
まとめ
今回は、Git・Githubの始め方について説明しました。導入は少々面倒でしたが仕組みを理解できれば、とても便利に活用することができます。
どんどんGit・Githubを活用して快適な開発ライフを楽しみましょう！
補足
今回はGit(バージョン管理システム)-SourceTree(GUI)-Github(共有)という3つのツールで説明しましたが、それぞれに類似のツールがあります。
バージョン管理システムとしてはMercurial、GUIとしては、Github Desktop、GitKraken、共有ツールとしてはGitLab、bitbucketなど様々なツールがあり、それぞれの使い勝手や相性を考慮して使用する必要があります。
筆者がWeb情報やGit関連の書籍を見わたす限りは、今回紹介したGit-Sourcetree-Githubというセットが人気の様でした。
参考資料
この記事は以下に紹介されている情報を参考にさせていただきました。
書籍
わかばちゃんと学ぶGit使い方入門
サルでもわかるGit入門
Gitが、おもしろいほどわかる基本の使い方33
Web
youtube:たにぐちまことのともすたチャンネルGit+Github入門
