Git
GitHub

GitHubのアカウント取得から、GitHubにデータをアップロードするまでの全手順

はじめに

「リポジトリ?」「黒画面触ったことないよ」という状態から、GitHubを取りあえず使えるようになるまでに学んだことをまとめました。わかりやすくするために説明を単純化しています。詳細は間違っているかもしれません。何か気づいたところがあったら、教えてもらえると助かります。

Gitとは、バージョン管理システムである

Git(ギット)とは、プログラムソースコードなどの変更履歴を管理するバージョン管理システムのことです。

GitHubとは、Gitの仕組みを利用したWebサービスである

GitHub(ギットハブ)は、Gitの仕組みを利用したWebサービスの名称です。GitHubは、GitHub社によって運営されています。GitHubは、Gitのサービスの中で最もユーザーが多く、個人・企業問わず無料で利用できます。無料プランでは、保存したデータを非公開にできませんが、有料プランでは非公開にできます。
※GitHub社は2018年6月にMicrosoftに買収されました。

Gitの最大の特徴は「分散型」であること

「分散型」とは、変更履歴を含む完全なデータを自分のパソコンに複製して、各々がその複製データを編集し、最後に統合する仕組みです。

「分散型」の反対は「集中型」です。「集中型」とは、複数人がサーバー上にある1つのデータを共同で編集する仕組みです。

Gitのメリット

  • ファイルの中身を編集してもファイル名を変更する必要がありません。
  • 過去のファイルに戻せます。
  • 様々なファイル形式のデータを扱えます。プログラムソースコードだけでなく、Excelファイル、画像ファイルなどもGitでバージョン管理ができます。
  • Gitで管理できるのは、プログラムのソースコードだけではありません。
  • ネット上でファイルの変更履歴をチームメンバーと共有できます。

GitHub用語

  • リポジトリとは、ファイルの変更履歴を保存する場所のこと。
  • ローカルリポジトリとは、自分のPC上のリポジトリのこと。ネット上ではなく、自分のPCのハードディスクなどの保存場所のこと。
  • リモートリポジトリとは、オンライン上のリポジトリのこと。
  • ステージングエリアとは、コミットする前のデータを一次的に保存する場所のこと。自分のPC上にあります。
  • ブランチとは、並行して行われる履歴を分岐して記録する機能のこと。
  • プルリクエストとは、開発者のローカルリポジトリでの変更を他の開発者に通知する機能のこと。
  • addとは、データをステージングエリアに保存するためのコマンド。
  • commitとは、データを自分のPCに保存するためのコマンド。データをローカルリポジトリに保存するコマンド。
  • pushとは、データをオンラインサーバーにアップロードするためのコマンド。アップロードと同義。リモートリポジトリに保存するコマンド。
  • pullとは、ローカルリポジトリにリモートリポジトリの変更を取り込むためのコマンド。
  • cloneとは、リモートリポジトリにあるデータをコピーして、ダウンロードすること。
  • mergeとは、差分を精査して、データを統合するためのコマンド。

GitHubの概念.png

GitHubに保存するまでの流れ

  1. ソースコードを書きます。
  2. きりのいいところで、「add」コマンドを使って、「ステージングエリア」に保存します。
  3. 「commit」コマンドで、「ローカルリポジトリ」に保存します。
  4. 「push」コマンドで、「リモートレポジトリ」に保存します。

Gitのダウンロードとインストール

GitHubを使うには、Gitをインストールしなければなりません。GitHubのインストールではありません。Gitです。以下のページからGitをダウンロードします。
https://git-scm.com/

ダウンロードした「Git-2.17.1.2-64-bit.exe」をダブルクリックします。「Next」を2回ほどクリックすると、以下の画面が出ます。

  • 「Additional Icons」は、アイコンをデスクトップに置くか聞いています。不要であればチェックを外します。
  • 「Windows Explorer Integration」は、ファイルを右クリックしたときのメニューに追加するか聞いています。不要だと思います。
  • 「Git LFS」は、よくわかりませんが、使うらしいのでチェックを入れます。
  • 「Use a TrueType font in all console windows」は、文字化けが起こるらしいのでチェックを外します。

Gitセットアップ.PNG

次に、どのテキストエディタを使うか聞いてきます。デフォルトがVimであり、多くの人がVimを使っているようなので、Vimを選びます。あとからでも変更できるようです。
Gitセットアップ2.PNG

次に、環境変数をどうするか聞いてきます。デフォルトの「Use Git from the Windows Command Prompt」を選びます。コマンドプロンプトで、Gitのコマンドだけ使えるようにするということらしいです。

Gitセットアップ3.PNG

次に、どのSSLライブラリにするか聞いてきます。デフォルトの「Use the OpenSSL library」を選びます。
Gitセットアップ4.PNG

次に、改行コードの取り扱いについて聞いてきます。「Checkout as-is, commit Unix-style line endings」を選びます。「チェックアウト時は改行コードは何もしない、コミット時は全てLFに変換する。」ということらしいです。デフォルトは一番上で、「チェックアウト時に改行コードはCR LFに変更し、コミット時には全てLFに変換する。」という意味です。勝手に改行コードを変更されてしまいます。一番上はバグが多いようなので、推奨しないとの声が多いです。
Gitセットアップ5.PNG

次に、コンソールをどうするか聞いてきます。デフォルトの「Use MinTTY」を選びます。「Use Windows' default console windows」は一見良さそうですが、一部機能が制限されたり、フォント設定の変更が必要だったり、何かと使いづらいようです。
Gitセットアップ6.PNG

最後にその他の設定について聞いてきます。すべてにチェックを入れます。
「Enable file system caching」は、キャッシュを利用するかです。チェックを入れると応答速度が早くなります。
「Enable Git Credential Manager」は、Git系のサイトへのアクセス時二段階認証を行うかを聞いています。
「Enable symbolic links」は、シンボリックリンクを使うかを聞いています。シンボリックリンクとは、ショートカットフォルダ機能のようなものです。

Gitがインストールできたかを確認

「スタート」ボタンからプログラムファイルをたどって「Git Bash」を起動します。
Git_Bash.PNG

Git Bahの黒い画面に「git --version」と入力し、バージョン情報が表示されることを確認します。
Git_Bash2.PNG

Git Bashの起動

Git Bashとは、Gitを操作するための黒い画面のことです。Git Bashを起動するには、「スタート」→「Git」→「Git bashGit bash」の順にクリックします。

ユーザー名とパスワードの設定

Git Bashに以下のコマンドを入力します。$ は最初から入力されているので、入力しません。

$ git config --global user.name "好きな名前を英語で"
$ git config --global user.email XXXX@example.com

初期設定.PNG

ユーザー名とパスワードの設定が成功したかを確認します。以下のフォルダに移動します。
C:\Users\XXXX  ← XXXXはユーザー名

そのフォルダの中に、.gitconfig というファイルが生成されているはずです。
.gitconfig を右クリックし、「プログラムから開く」→「メモ帳」を選択し、中身を表示します。下の画像のようにnameやemailが表示されていればOKです。
初期設定2.PNG

初期設定3.PNG

コマンド用語

ここから黒画面(Git Bash)を使います。黒画面を操作するには、コマンドを入力しなければなりません。以下がよく使われるコマンドです。

コマンド 内容
mkdir make directory。ディレクトリ(=フォルダ)を作成。「mkdir XXX」でXXXフォルダを作成という意味
cd change directory。ディレクトリに移動。cd XXXで、XXXフォルダに移動という意味
pwd print working directory。現在いるディレクリを表示
ls list segments。現在いるディレクリのファイルをリスト形式で表示
git init リポジトリを作成
git clone クローンを作成
git branch ブランチの一覧を表示。頭に * のついているものが現在のブランチを表す
git branch XXX ブランチを作成。「git branch XXX」でXXXというブランチを作成という意味
git checkout ブランチを移動。「git checkout XXX」でXXXというブランチに移動するという意味
git commit -a これまでの修正をすべてコミット
git push origin ファイルをプッシュ。「git push origin XXX」でXXXというブランチにファイルをプッシュするという意味

プロジェクトの作成

プロジェクトとは、課題の名前です。好きな名前をつけましょう。今回はプロジェクト名を「sample」にします。

mkdir sample
cd sample
git init

C:\Users\XXXX\sample というディレクトリが作成され、中には、隠しファイルで「.git」というファイルが作成されます。

GitHubのアカウント作成

自分のPC(ローカル)の設定ができたので、次にGitHub側の準備をします。GitHubのWebサイトにアクセスして、アカウントを作成します。
https://github.com/
GitHub登録.PNG

無料版の「Unlimited public repositories for free.」を選択して、「Continue」をクリック。
GitHub登録2.PNG

次はアンケート画面です。入力するか、スキップします。次の画面で「Start a project」をクリックします。利用開始するにはアカウントを認証しなければなりません。登録したメールアドレスに届いたメールを開き、「Verify email address」をクリックし、リンクを開きます。「Start a project」をクリックします。

リモートリポジトリの作成

「Repository name」に、今回は「sample」と入力します。「Repository name」の「Initialize this repository with a README」にチェックを入れて「Create repository」をクリックします。これでリモートリポジトリが作成できました。
リモートリポジトリ作成2.PNG

クローンの作成

クローンとは、リモートリポジトリのデータをコピーして、ダウンロードすることです。「Clone or download」をクリックし、URLをクリックします。
clone.PNG

Git Bashで、git cloneコマンドに続けて、今コピーした文字列を貼り付けます。GitBashでは、ctrl+V は使えないので、右クリックして「Paste」を選びます。

$ git clone git@github.com: ユーザー名 / リポジトリ名 .git

clone2.PNG

保存されているか自分のPCを確認します。
C:\Users\XXXX\sample ← XXXXはユーザー名
の中に、「Sample」というフォルダが生成されていれば、成功です。

ブランチ作成

ブランチとは、並行して行われる作業の変更履歴を分岐させて保存する機能のことです。
クローンで作成したsampleフォルダに移動し、現在のブランチを表示します。現在は、masterブランチのみが存在しています。
ブランチ作成.PNG

作業ブランチの作成

masterブランチは触らずに取っておいて、作業ブランチを作成し、作業ブランチを更新してみます。まずは、git branchコマンドでworkfileという名前のブランチを作ります。

$ git branch workfile

ブランチ作成2.PNG

現在のブランチであるmasterから、ブランチをworkfileに移動します。

$ git checkout workfile

ブランチ作成3.PNG

ファイルを作成

hello.txtというファイルを作成して、workfileブランチに追加してみます。vimコマンドで、hello.txtファイルを作成します。Enterを押すと、自動的に別画面でVimが立ち上がります。Vimとは黒画面で使えるテキストエディタソフトのことです。

$ vim hello.txt

vim1.PNG

vim2.PNG

別画面にhelloと入力し、vimを終了します。終了するには、Escボタンを押し、:wqと入力します。:wqは見にくいですが、左下に入力されているはずです。
vim3.PNG

vimの終了コマンド

Vimを抜ける方法はいくつかあります。Escボタンを押した後、以下のコマンドを入力し、Enterを押すと、Vimを抜けられます。
保存済みのファイルを開いているvimから抜ける場合
:q
ファイルを保存しないでvimを抜ける場合
:q!
ファイルを保存してからvimを抜ける場合
:wq

ファイルをステージングエリアにアド

作成したファイルをステージングエリアにアドします。

$ git add hello.txt 

アドできているか確認します。新規ファイルとしてhello.txtが認識されています。

$ git status

add.PNG

ローカルリポジトリにコミット

アドしたファイルを、ローカルリポジトリにコミットします。git commit -a は、これまでの修正をすべてコミットするコマンドです。

$ git commit -a

実行すると、Vimが開くので、コミットに関するコメントを入力します。「新規ファイルの追加」と入力しました。Escボタンを押し、:wqと入力し、Vimを閉じます。
commit.PNG

Vimでコメントの保存、終了をすると、コミットが完了します。git statusコマンドで状態を確認します。コミットできていれば、下の画像のコメントが表示されます。
commit2.PNG

GitHubへプッシュ

コミットしたファイルを、GitHubへプッシュ(アップロード)します。git pushコマンドを使って、workfileブランチにhello.txtをアップロードします。

$ git push origin workfile

push.PNG

GitHubにアクセスしてみると、ブランチが2つになっていることがわかります。
push2.PNG