【GitHub/2020年6月更新/初心者向け】Gitコマンドを使って資材をGitHubに反映する方法！

今回はGitHubにリポジトリの作成から既存コード(資材)を公開するまでの手順を記していきます。
CUIを使って、行なっていくので、Gitコマンドが使えると理解しやすいと思います。
コマンドがまだ不安な方でもGitHubへの反映ができるように書いていきます。

1.事前準備

GitHubにあげるための資材
GitHubのアカウント
Git

アカウント作成をまだ行なっていない方はこちらの記事を参考にして見てください。

44igarashi.hatenablog.com

Gitのインストールがまだの方はこちらの記事を参考にしてみてください。

44igarashi.hatenablog.com

44igarashi.hatenablog.com

2.新規リポジトリの作成

GitHubにログインをし、リポジトリ新規作成画面を表示しましょう。
こちらから表示出来ます。

https://github.com/new

Repository name：任意のリポジトリ名を入力しましょう。
Description：任意の説明があれば入力しましょう。
Public：ソースコードを公開する場合はこちら (今回はこちらを選択)
Private：ソースコードを非公開にする場合はこちら

入力が完了したら「Create repository」をクリックします。

これでリポジトリの作成が完了しました。
左上に表示されているのが、今回作成したリポジトリです。

3.反映資材の確認

今回使用する資材は下記になります。
この資材をGitHubへの反映まで行なっていきます。

/Applications/MAMP/htdocs/project/index.html
/Applications/MAMP/htdocs/project/test.php

4.プロジェクトへの移動

次に、ターミナルを起動し、projectディレクトリへ移動します。
※Windowsの方は「Git Bash」もしくは「コマンドプロンプト」を使用してください。

  cd /Applications/MAMP/htdocs/project
  cd {パス}/{あげたい資材のディレクトリ}

5.Gitの設定

Gitに登録したメールアドレスを設定します。

  git config --global user.email hoge@hoge.com
  git config --global user.email {メールアドレス}

6.ローカル環境からステージング環境へadd

1度ステージング環境へaddする資材の確認をします。
addしたい資材が表示されていればOKです。

  git status

  index.html
  test.php

確認が出来たので、addしていきます。
addする資材を指定しましょう。

  git add index.html
  git add test.php
  もしくは
  git add *

  git add {ファイル名}

7.ステージング環境へcommit

addが無事出来ているか確認をします。

  git status

  new file: index.html
  new file: test.php

上記の通り表示されていればOKです。

それでは、commitしていきましょう。

  git commit -m "initial commit"
  git commit -m "commitする内容を記載"

  [master (root-commit) 79dd2d5] initial commit
  2 files changed, 4 insertions(+)
  create mode 100644 index.html
  create mode 100644 test.php

上記の通り表示されていればcommitは無事成功です。

8.リモートリポジトリの登録

先程、作成したリポジトリの画面を表示します。
画面真ん中に表示されているURLコピーします。

ターミナルを開き下記コマンドを実行し、リモートリポジトリの登録をします。

  git remote add origin https://github.com/44igarashi/test2.git
  git remote add origin {先程コピーしたURL}

9.リモートリポジトリへ反映(Push)

最後に、リモートリポジトリへ反映(Push)を行います。
push後、ユーザー名とパスワードが求められるので入力しましょう。

  git push origin master
  
  Username for {GitHubのユーザーネーム}
  Password for {GitHubへのパスワード}

  Enumerating objects: 4, done.
  Counting objects: 100% (4/4), done.
  Delta compression using up to 4 threads
  Compressing objects: 100% (2/2), done.
  Writing objects: 100% (4/4), 332 bytes | 83.00 KiB/s, done.
  Total 4 (delta 0), reused 0 (delta 0), pack-reused 0
  To https://github.com/44igarashi/test2.git
   * [new branch]      master -> master

上記の様に表示されればGitHubへの反映は完了です！
Gitコマンドに慣れていない方は、何をしているかよく分からないかもしれませんが
使っていくうちに慣れてくると思うので、めげずに行なっていきましょう！