📚

Githubを始める【第1回】 ：Githubにソースを追加

に公開
Git
GitHub
初学者向け
開発
webアプリケーション
tech

前提

  • 以下を対応済み
    • Gitをインストール済み
    • GitとGithubをSSHで接続み
    • VSCodeをインストール済み
      （エディタがあればいいので必須ではない）
  • チーム開発に必要なGit,Githubについて、
    まずは自分で自分のソースを管理できるようになるために本記事では以下を説明します。(下図参照）
    • Git（ローカル）:
      mainブランチからfeatureブランチを作成 → ソース追加 → コミット → Push
    • GitHub（リモート）:
      originにfeatureブランチが新しく作られ、ソースが追加される
  • 一部、ChatGPTを使用して記述している箇所があります。
    主に補足として必要だと思った箇所をChatGPTで深掘りしてます。
    なお、該当箇所は「（ChatGPT出力）と記載しております。
  • 筆者はWEB開発に関してビギナーレベル（某プログラミングスクール卒業）です。
    正確な情報を心がけておりますが誤りや不足がございましたら申し訳ありません。
    またそのような記載がありましたら、ご指摘などいただけますと幸いです。

#1 リモートリポジトリ作成

1.1.ダッシュボードから「New」をクリック

1.2.Repository nameを入力して「Create repository」をクリック

リポジトリを公開したくない場合はリポジトリの公開設定を「Public」ではなく、「Private」を選択 しておきましょう。

1.3.リモートリポジトリ作成完了

#2 ローカルリポジトリを作成

2.1.作業ディレクトリを作成

ローカルリポジトリ用の作業ディレクトリを作成します。
作業ディレクトリ（Workspace/demo）を作成し、demoディレクトリに移動してください。
※作業ディレクトリは任意の名前でOK。

cd # ホームディレクトリに移動
mkdir Workspace # mkdir：対象のディレクトリを作成
cd Workspace # cd：対象のディレクトリに移動
mkdir demo 
cd demo

2.2.ターミナルを開きgit init で初期化

作業ディレクトリでローカルリポジトリを作成するための初期化を行います。

git init

コマンドを実行すると/demo/.git/配下に.gitが作成されます。
ただし、.（ドット）で始まるファイルは隠しファイルなので、
Finder（Windowsはエクスプローラ）からは見ることができません。

補足（chatGPT出力)：黄色文字で「hint:」となっている箇所について補足

hint: 'master' を初期ブランチ名として使ってるけど、これは変わるかもよ
hint: これを抑制したいなら、以下のコマンドで初期ブランチ名を設定してね：

git config --global init.defaultBranch <name>

例）git config --global init.defaultBranch main

hint: よく使われるブランチ名としては 'main', 'trunk', 'development' などがあるよ
hint: 作ったばかりのブランチ名は以下で変更できるよ：

git branch -m <name>

2.3.Githubにデフォルトリポジトリを追加

まず、ローカルリポジトリからリモートリポジトリに origin というデフォルトリポジトリを追加します。

git remote add origin <リモートリポジトリのURL（SSH接続のリンク）>

Gitでは標準のリモートリポジトリ名をorigin とする習慣があるため、ここでは慣例に倣いそうします。

2.4.Githubにデフォルトリポジトリが正しく追加されていることを確認

git remote -v

origin という名前があればOK！

2.5.ローカルリポジトリに初回コミット

初回コミットを作成しましょう。

echo "# Demo Repo" > README.md  # テスト用ファイル作成
git add README.md               # ステージング
git commit -m "Initial commit"  # 初回コミット

echo でファイルを作成できたらFinderからもREADME.mdファイルが作成されていることを確認してみましょう。

一連のコマンドの実行結果はこのようになります。

2.6. 初期ブランチが作成されていることを確認

git branch

masterというブランチがあればOK！

#3 リモートリポジトリにプッシュ（ローカルリポジトリとリモートリポジトリを紐付け）

3.1.リモートリポジトリに初回プッシュ

ローカルリポジトリで変更を行い commit（コミット） した場合、
それをリモートリポジトリに反映させるためには push（プッシュ） を行います。
まず、以下の手順で、ローカルリポジトリの初期ブランチを
masterからmainにリネームしておきましょう。
昔は初期ブランチをmasterとする形が主流でしたが、
現在は初期ブランチをmainとする形が主流なので、これも慣例に倣いましょう。

次に、リモートリポジトリ origin にプッシュします。

git branch -m main             # ← 現在のブランチ名を main にリネーム
git push -u origin main        # ← リモートに初回プッシュ


では、リモートリポジトリが反映されているかGithubからも確認してみましょう。
まず、Githubにログインし、左上メニューから「Repositories」をクリックします。

#1で作成したリモートリポジトリ「demo_20240625」をクリックします。

リモートリポジトリ「demo_20240625」に READEME.md ファイルが追加されていればOK！

補足：今のGItの状態について
ここまでの作業でローカルの main ブランチとリモートの origin/main ブランチの紐付け（同期）ができました。

(ローカル main) ─── git push ───> (リモート main 新規作成＆反映)

この時点では main 同士なので差分はなく、プッシュ時にGithub側でプルリクエストはスキップされます。（「プルリクエスト」は詳しくは後述します。）

補足：
ここまで -v -m -u など-（ハイフン）に続けてアルファベット一文字を
プロンプトに含める操作がありましたが
これはGitの オプション（コマンドに追加してその動作を変更・拡張するための指定） です。
よく使うGit関連のオプションをAppendix にまとめましたのでご参考に。

#4 ファイルを追加し、リモートリポジトリに変更を反映

4.1.作業用ブランチを作成

作業ディレクトリに移動
（すでにいる場合はスキップOK）

cd ~/Workspace/demo

念のためリモートの最新 main を取得（pull）します。
pull（プル）とはリモートリポジトリからローカルリポジトリにファイルを引き出すことを指します。pushの逆。

git branch # 今いるブランチを確認
git checkout main # ローカルのmainブランチに切り替え
git pull origin main # "origin"リモートリポジトリの"main"ブランチをプル

これでリモート main の最新状態をローカルに取り込みます。
（初回push後で変更がなければ何も変化しませんが、手順として重要です）

作業用ブランチを作成＆切り替えます。
※ブランチ名は任意の名前でOK。

git checkout -b feature/001-demo
git branch

git checkout コマンドは 特定のコミットを取り出すコマンドです。
チェックアウトは「ホテルをチェックアウトする」というように「出ていく」イメージが強いので混乱するかもしれませんが 「取り出す」 という意味もあり、
git checkout のチェックアウトは後者のニュアンスで使われます。

また -b オプションを付与することで、加えてブランチを作成することができます。
つまり git checkout -b コマンドはブランチを作成して、それを取り出す、2つの操作を1つの操作で行うためのコマンドです。

以下のようになっていればOK！
feature/001-demoブランチが作成&切り替えができていていますね！

4.2.demoディレクトリ配下にファイルを一つ追加

demoディレクトリ配下にpractice.mdを追加してみましょう。

touch practice.md  # ファイルを作成
code practice.md   # Visual Studio Codeを使ってファイルを開く

practice.mdに以下の内容をコピペ

# 4. ファイルを追加し、リモートリポジトリに変更を反映

このファイルは、以下の Git 操作手順を練習することを目的としてます。
- 作業ブランチを作成: `feature/001-demo`
- 練習ファイルを作成: `practice.md` ← 今ここ
- 変更内容をステージングしてコミット
- 変更内容をリモートリポジトリにプッシュ
- GitHub 上でプルリクエストを作成し、マージ

4.3.変更をステージングしてコミット

まずは、変更内容を確認しましょう。

git status # 変更ファイルの一覧を表示


変更内容をステージングしましょう。

git add practice.md
git status

補足
git add . で変更内容全てをステージングすることもできます。

ステージング後に改めて状態を確認すると先ほど「Untracked files:」と表示されていましたが、
「Changes to be committed:」に変わってますね！

変更内容をコミットしましょう。

git commit -m "Add practice.md for Git operation practice"

4.4.変更内容をプッシュしてGithubからプルリクエストをマージ

GIthub（リモートリポジトリ）にプッシュしましょう。

git push -u origin feature/001-demo

feature/001-demo ブランチについて
「Compare ＆ pull request」というメニューが表示されているのでそれをクリックしてください。

コミットメッセージを記載して、「Create pull request」をクリックしてください。

差分確認が走るのでそれが完了したら、「Merge pull request」をクリックしてください。

対象のプルリクエストが「Merged」となればOKです！
ここまでの操作で、orign の mainブランチに
feature/001-demo ブランチをマージすることができました。

#5 事後作業

最後に、ローカル側の事後作業を忘れずにしましょう。
今は、ローカル側もmain ブランチに feature ブランチを取り込む必要があります。

git checkout main
git pull origin main

Appendix

よく使うGitオプション一覧（ChatGPT出力）

🔹 git branch

オプション 意味
-m <新名> ブランチ名を変更する
-d <名> ブランチを削除する（マージ済みのもの）
-D <名> ブランチを強制削除する（未マージでも削除）

🔹 git push

オプション 意味 備考
-u upstream（追跡ブランチ）を設定（以降 git push だけでOK） 詳細は後述「-u は upstream（追跡ブランチ） について」を参照
--force または -f 強制プッシュ（慎重に使う！）

🔹 git remote

オプション 意味
-v 登録されているリモートURL一覧表示
add 新しいリモートリポジトリを登録
set-url 既存リモートのURLを変更
remove リモートを削除

🔹 git init

オプション 意味
--bare 作業ディレクトリを持たないリポジトリ（サーバ用）

🔹 git status

オプション 意味
-s 簡易表示（short形式）
-b ブランチ情報も表示する

🔹 git log

オプション 意味
--oneline 1コミット1行の簡易ログ
--graph ブランチの分岐をASCIIグラフで表示
-p 差分も一緒に表示

🔹 git diff

オプション 意味
--staged ステージング済みの差分を表示する

-u は upstream（追跡ブランチ） について（ChatGPT出力）

🔹 u （または -set-upstream）の役割

git push -u origin main

を実行すると、次のことが起きます：
1️⃣ ローカルの main ブランチ と
2️⃣ リモートの origin/main ブランチ が 紐づく（追跡関係が作られる）

✅ 追跡ブランチを設定すると何が便利？

その後の作業で：

git push
git pull

のように ブランチ名やリモート名を省略して実行できるようになります。
つまり毎回：

git push origin main

のようにブランチ名を明示しなくてOKになります。

🚩 注意：新しい作業ブランチの場合は？

新しいブランチを作った場合、そのブランチとリモートブランチは自動では追跡関係になりません。
💡 つまり、新しい作業ブランチで最初にプッシュするときは：

git push -u origin feature-branch

と そのブランチごとに一度 -u を付けて upstream 設定する必要があります。

🎯 結論

✅ -u はそのブランチだけに有効

→ 他のブランチをプッシュするときは、初回だけまた -u が必要です。

✨ 補足（よくやる流れ）

作業ブランチを作ったら：

git checkout -b feature-branch
git push -u origin feature-branch

→ 以降は

git push
git pull

だけでOKになります。

参考文献

  • はじめてでもできる GitとGitHubの教科書 （たにぐち まこと 著）

Discussion