Git／GitHubでコード管理しよう

このハンズオンでは、Git／GitHubについて実際にハンズオン形式で手を動かしながら体験します。

  • Gitリポジトリの初期化と.gitignoreの作成
  • ファイルのステージング・コミット・履歴確認
  • GitHubへのプッシュ
  • ブランチの作成と機能追加
  • プルリクエストの作成・確認・マージ
  • mainブランチへの反映確認

このハンズオンで体験するGit／GitHubを使った開発の流れを以下に示します。

flowchart LR
    A[ブランチ作成] --> B[コード変更]
    B --> C[ステージング<br>・コミット]
    C --> D[GitHubへ<br>プッシュ]
    D --> E[プルリクエスト<br>作成]
    E --> F[レビュー<br>・マージ]
    F --> G[mainに反映]

1. 事前準備

このハンズオンでは、以下のツールが必要です。まだ準備できていない場合は、リンク先の手順に沿って準備をお願いします。

2. フォルダの作成

まず、任意の場所にgit-practiceフォルダを作成します。

git-practice/  ← このフォルダを作成

作成したフォルダをVisual Studio Codeで開きます。Visual Studio Codeのメニューから「ファイル」→「フォルダーを開く」を選択し、作成したフォルダを開いてください。

Visual Studio Codeのメニューから「ターミナル」→「新しいターミナル」を選択してターミナルを開きます。

3. リポジトリの初期化

Gitでファイルの変更履歴を管理するには、まずフォルダをGitリポジトリとして初期化する必要があります。初期化すると、フォルダ内に .git という隠しフォルダが作成され、Gitがこのフォルダ内の変更を追跡できるようになります。

git init

実行すると以下のように表示されます。

Initialized empty Git repository in /path/to/git-practice/.git/

「empty Git repository（空のGitリポジトリ）」が作成されたことが確認できます。この時点ではまだ何もコミットされていない状態です。

4. .gitignoreの作成

リポジトリを初期化したら、最初に.gitignoreファイルを作成します。不要なファイルが誤ってコミットされることを防ぐため、他のファイルをコミットする前に設定しておくのが一般的です。

Visual Studio Codeのエクスプローラーで右クリックし、「新しいファイル」を選択して.gitignoreを作成します。

git-practice/
└── .gitignore  ← このファイルを作成

作成したファイルに以下の内容を記述して保存します。

# Python
__pycache__/
*.pyc
venv/

# 環境変数
.env

# IDE
.vscode/
.idea/

# OS
.DS_Store

それぞれの記述内容を確認しましょう。

記述 説明 除外する理由
__pycache__/ Pythonのキャッシュフォルダ 実行時に自動生成されるため
*.pyc Pythonのキャッシュファイル 実行時に自動生成されるため
venv/ 仮想環境フォルダ 大量のファイルを含み、requirements.txt で管理するため
.env 環境変数ファイル APIキーやDB接続情報などの機密情報が含まれるため
.vscode/ Visual Studio Codeの設定 個人の開発環境に依存する設定のため
.idea/ JetBrains系エディタの設定 個人の開発環境に依存する設定のため
.DS_Store macOSが自動生成するファイル 開発とは無関係なため
💡 ポイント
.gitignore はプロジェクトの最初に作成するのがベストプラクティスです。後から .gitignore に追加しても、すでにGitで追跡されているファイルは自動的には除外されません。最初に適切な .gitignore を用意しておくことで、不要なファイルがリポジトリに混入するのを防げます。

.gitignoreを作成したら、Gitに変更を記録します。Gitでは、変更をいきなり記録（コミット）するのではなく、まず git add で記録したいファイルをステージングエリアに追加し、次に git commit で確定するという2段階の手順を踏みます。

git add .gitignore

git add はファイルをステージングエリアに追加するコマンドです。ステージングエリアとは「次のコミットに含めるファイルの一覧」のことです。続けてコミットを実行します。

git commit -m "chore: .gitignoreを追加"

実行すると以下のように表示されます。

[main (root-commit) xxxxxxx] chore: .gitignoreを追加
 1 file changed, 11 insertions(+)
 create mode 100644 .gitignore

-m オプションの後にコミットメッセージを指定します。コミットメッセージは「どのような変更を行ったか」を簡潔に記述します。出力の 1 file changed, 11 insertions(+) は、1つのファイルが変更され、11行が追加されたことを示しています。

5. 最初のファイルを反映する

5.1 ファイルの作成

Visual Studio Codeのエクスプローラーで右クリックし、「新しいファイル」を選択してcalculator.pyを作成します。

git-practice/
├── .gitignore
└── calculator.py  ← このファイルを作成

作成したファイルに以下の内容を記述して保存します。

a = 3
b = 5
print(f"{a} + {b} = {a + b}")

5.2 状態の確認

ファイルを作成したら、Gitがどのような状態にあるかを確認します。git status は現在の作業ディレクトリの状態を表示するコマンドで、どのファイルが変更されたか、どのファイルがまだステージングされていないかがわかります。

git status

実行すると以下のように表示されます。

On branch main
Untracked files:
  (use "git add <file>..." to include in what will be committed)
        calculator.py

nothing added to commit but untracked files present (use "git add" to track)

Untracked files（未追跡ファイル）として calculator.py が表示されています。これは、このファイルがまだGitの管理対象になっていないことを意味します。git add でステージングすることで、次のコミットに含めることができます。

5.3 ステージングとコミット

状態を確認したら、calculator.py をステージングしてコミットします。

git add calculator.py

git commit -m "feature: 計算ツールを追加"

実行すると以下のように表示されます。

[main xxxxxxx] feature: 計算ツールを追加
 1 file changed, 3 insertions(+)
 create mode 100644 calculator.py

新しいファイル calculator.py が3行の内容とともにコミットされました。

5.4 コミット履歴の確認

コミットが正しく記録されているかを確認するために、コミット履歴を表示します。git log --oneline は、各コミットを1行ずつ簡潔に表示するコマンドです。

git log --oneline

実行すると以下のように表示されます。

xxxxxxx feature: 計算ツールを追加
xxxxxxx chore: .gitignoreを追加

2つのコミットが新しい順に表示されています。左側の xxxxxxx はコミットを識別するためのコミットハッシュ（短縮形）で、実際には a1b2c3d のような英数字の文字列が表示されます。

6. GitHubリポジトリの作成とプッシュ

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

GitHubにアクセスし、新しいリポジトリを作成します。画面右上の「+」ボタンから「New repository」を選択します。

リポジトリの作成画面が表示されたら、 Repository name に git-practice と入力します。この名前がGitHub上のリポジトリのURLの一部になります。

次に、リポジトリの公開範囲を選択します。 Public にすると誰でも閲覧できるリポジトリになり、 Private にすると自分（と招待したメンバー）だけがアクセスできるリポジトリになります。学習用のため Private がおすすめです。

Initialize this repository with の項目（README、.gitignore、licenseの追加）は、すべてチェックを外したままにします。すでにローカルにGitリポジトリを作成済みのため、ここでファイルを追加するとプッシュ時に競合が発生してしまいます。

設定が完了したら「Create repository」をクリックしてリポジトリを作成します。

無事にリポジトリが作成されれば、ここまでの操作は完了です。

6.2 リモートリポジトリの登録とプッシュ

リポジトリが作成されると、セットアップ用のコマンドが表示されます。「…or push an existing repository from the command line」に記載されているコマンドを参考に、まずデフォルトブランチの名前を main に設定します。

git branch -M main

Gitのバージョンや設定によっては、デフォルトブランチ名が master になっている場合があります。GitHubでは main が標準のため、このコマンドで現在のブランチ名を main に変更しておきます。

次に、ローカルリポジトリとリモートリポジトリを紐づけます。

git remote add origin https://github.com/ユーザ名/git-practice.git

git remote add は、リモートリポジトリの接続先を登録するコマンドです。origin はリモートリポジトリに付ける名前で、慣習的に origin が使われます。URLの「ユーザ名」の部分は、自分のGitHubユーザ名に置き換えてください。

続けて、ローカルのコミット履歴をリモートリポジトリに送信（プッシュ）します。

git push -u origin main

実行すると以下のように表示されます。

Enumerating objects: 6, done.
Counting objects: 100% (6/6), done.
Delta compression using up to 8 threads
Compressing objects: 100% (4/4), done.
Writing objects: 100% (6/6), 553 bytes | 553.00 KiB/s, done.
Total 6 (delta 0), reused 0 (delta 0)
To https://github.com/ユーザ名/git-practice.git
 * [new branch]      main -> main
branch 'main' set up to track 'origin/main'.

-u オプションは、ローカルの main ブランチとリモートの origin/main ブランチを紐づける設定です。一度設定すれば、以降は git push だけでプッシュできるようになります。出力の [new branch] main -> main は、リモートに新しいブランチが作成されたことを示しています。

プッシュが完了したら、GitHubのリポジトリページをブラウザで開いてください。.gitignoreとcalculator.pyが表示されていれば、プッシュは成功です。

7. ブランチの作成と機能追加

7.1 ブランチの作成

ここからは、ブランチを使った開発を体験します。ブランチとは、mainブランチから分岐して独立した作業を行うための仕組みです。mainブランチに直接変更を加えるのではなく、ブランチを作成して作業することで、変更を安全に管理できます。

新しいブランチを作成し、同時にそのブランチに切り替えます。

git switch -c feature/add-subtract

実行すると以下のように表示されます。

Switched to a new branch 'feature/add-subtract'

git switch -c は、新しいブランチを作成して切り替えるコマンドです。-c は「create（作成）」の意味です。ブランチ名の feature/add-subtract は「引き算機能を追加する」という意図を表しています。ブランチ名に feature/ というプレフィックスを付けるのは、チーム開発でよく使われる命名規則です。

7.2 コードの変更

calculator.pyに引き算の処理を追加します。ファイルの内容を以下のように書き換えてください。

a = 3
b = 5
print(f"{a} + {b} = {a + b}")
print(f"{a} - {b} = {a - b}")

7.3 変更の確認とコミット

コードを変更したら、コミットする前に git diff で変更内容を確認します。意図しない変更が含まれていないかをチェックするために、コミット前に差分を確認する習慣をつけましょう。

git diff

実行すると以下のように表示されます。

diff --git a/calculator.py b/calculator.py
index xxxxxxx..xxxxxxx 100644
--- a/calculator.py
+++ b/calculator.py
@@ -1,3 +1,4 @@
 a = 3
 b = 5
 print(f"{a} + {b} = {a + b}")
+print(f"{a} - {b} = {a - b}")

行頭の + が付いている行が追加された行です。引き算の処理が1行追加されていることが確認できます。変更内容に問題がなければ、ステージングしてコミットします。

git add calculator.py

git commit -m "feature: 引き算機能を追加"

実行すると以下のように表示されます。

[feature/add-subtract xxxxxxx] feature: 引き算機能を追加
 1 file changed, 1 insertion(+)

ブランチ名が feature/add-subtract になっていることに注目してください。先ほどのコミットは main ブランチで行いましたが、今回は feature/add-subtract ブランチにコミットされています。

7.4 フィーチャブランチのプッシュ

作業ブランチでの変更をリモートリポジトリにプッシュします。ブランチをプッシュすることで、GitHub上でプルリクエストを作成できるようになります。

git push -u origin feature/add-subtract

実行すると以下のように表示されます。

Enumerating objects: 5, done.
Counting objects: 100% (5/5), done.
Delta compression using up to 8 threads
Compressing objects: 100% (2/2), done.
Writing objects: 100% (3/3), 340 bytes | 340.00 KiB/s, done.
Total 3 (delta 0), reused 0 (delta 0)
remote:
remote: Create a pull request for 'feature/add-subtract' on GitHub by visiting:
remote:      https://github.com/ユーザ名/git-practice/pull/new/feature/add-subtract
remote:
To https://github.com/ユーザ名/git-practice.git
 * [new branch]      feature/add-subtract -> feature/add-subtract
branch 'feature/add-subtract' set up to track 'origin/feature/add-subtract'.

出力にプルリクエストの作成URLが表示されています。このURLからプルリクエストを作成することもできますが、ここではGitHubの画面から作成します。

8. プルリクエストの作成とマージ

8.1 プルリクエストの作成

ブラウザでGitHubのリポジトリページを開きます。画面上部の「Pull requests」タブをクリックします。

続いて、「New pull request」ボタンをクリックします。

ブランチの比較画面が表示されたら、まず base が main になっていることを確認します。これがマージ先（変更を取り込む側）のブランチです。次に compare のドロップダウンをクリックし、 feature/add-subtract を選択します。これがマージ元（変更を加えた側）のブランチです。ブランチを選択すると差分が表示されるので、内容を確認して「Create pull request」をクリックします。

タイトル には feature: 引き算機能を追加 と入力します。コミットメッセージと同様に、どのような変更かが一目でわかるように記述します。 説明 欄には変更内容の詳細を記入します。レビュアに変更の目的や確認してほしいポイントが伝わるように書きましょう。例えば以下のように記述します。

## 概要
calculator.py に引き算の機能を追加しました。

## 変更内容
- `a - b` の計算結果を出力する処理を追加

## レビュアへのお願い
- 出力フォーマットが足し算と統一されているか確認をお願いします

内容を確認して「Create pull request」をクリックします。

8.2 変更内容の確認

プルリクエストが作成されると、変更内容の詳細ページが表示されます。

「Files changed」タブをクリックすると、変更されたファイルの差分を確認できます。実際のチーム開発では、ここでレビュアがコードを確認し、コメントや承認を行います。

8.3 レビューの実施

「Files changed」タブでは、変更内容を確認するだけでなく、コードに対してレビューコメントを残すことができます。

コメントを残したい行にカーソルを合わせると、行の左側に「+」ボタンが表示されます。

クリックするとコメント入力欄が開くので、気になった点や質問を記入して「Start a review」をクリックします。複数の箇所にコメントを残したい場合は、同じ手順を繰り返すことで1つのレビューにまとめることができます。

すべてのコメントを書き終えたら、画面右上の「Submit review」ボタンをクリックします。レビューの送信画面が表示され、全体に対するコメントを入力できます。

その下に3つの選択肢があります。

Comment は、承認や修正依頼を伴わない一般的なフィードバックを送信する場合に選択します。質問や感想など、気軽なコメントを残したいときに使います。

Approve は、変更内容に問題がないと判断し、マージを承認する場合に選択します。チーム開発では、一定数のApproveが得られないとマージできないルールを設けることが多いです。

Request changes は、マージ前に修正が必要な箇所がある場合に選択します。修正依頼を受けた開発者は、指摘内容に対応してから再度レビューを依頼します。

選択したら「Submit review」をクリックしてレビューを送信します。

💡 ポイント
今回は自分自身が作成したプルリクエストのため、選択肢は Comment のみとなります。 Approve や Request changes は、他のメンバーが作成したプルリクエストに対してのみ使用できます。実際のチーム開発では、これらの機能を使ってコードの品質を保ちます。

8.4 マージの実行

変更内容に問題がないことを確認したら、「Merge pull request」をクリックします。 続けて「Confirm merge」をクリックしてマージを実行します。

マージが完了すると、「Pull request successfully merged and closed」というメッセージが表示されます。

マージ後、「Delete branch」ボタンが表示されるので、クリックして不要になったブランチを削除します。

削除するとdeleted the feature/add-subtract branchという履歴が残ります。

9. mainブランチへの反映を確認

9.1 GitHub上での確認

GitHubのリポジトリページで「Code」タブをクリックし、mainブランチのcalculator.pyを確認します。引き算の処理が追加されていれば、プルリクエストによるマージは成功です。

9.2 ローカルへの反映

GitHub上でマージが完了しましたが、ローカルの main ブランチにはまだ変更が反映されていません。リモートリポジトリの最新の状態をローカルに取り込みます。

まず、main ブランチに切り替えます。

git switch main

実行すると以下のように表示されます。

Switched to branch 'main'
Your branch is behind 'origin/main' by 2 commits, and can be fast-forwarded.
  (use "git pull" to update your local branch)

「Your branch is behind 'origin/main' by 2 commits」は、リモートの main ブランチがローカルよりも2コミット先に進んでいることを示しています。この時点で calculator.py の中身を確認すると、引き算の処理はまだ含まれていません。マージはGitHub上（リモート）で行われたため、ローカルの main ブランチにはまだ反映されていないのです。

a = 3
b = 5
print(f"{a} + {b} = {a + b}")

git pull でリモートの変更をローカルに取り込みます。

git pull origin main

実行すると以下のように表示されます。

From https://github.com/ユーザ名/git-practice
 * branch            main       -> FETCH_HEAD
Updating xxxxxxx..xxxxxxx
Fast-forward
 calculator.py | 1 +
 1 file changed, 1 insertion(+)

Fast-forward は、ローカルのブランチをリモートの最新状態まで早送りしたことを意味します。これでローカルの main ブランチにも引き算の処理が反映されました。再び calculator.py を開いてみると、引き算の処理が追加されていることが確認できます。

a = 3
b = 5
print(f"{a} + {b} = {a + b}")
print(f"{a} - {b} = {a - b}")

マージが完了したので、不要になったローカルのブランチを削除します。

git branch -d feature/add-subtract

実行すると以下のように表示されます。

Deleted branch feature/add-subtract (was xxxxxxx).

-d はブランチを削除するオプションです。マージ済みのブランチのみ削除できるため、誤って未マージのブランチを削除してしまう心配はありません。

最終的なコミット履歴を確認します。

git log --oneline

実行すると以下のように表示されます。

xxxxxxx Merge pull request #1 from ユーザ名/feature/add-subtract
xxxxxxx feature: 引き算機能を追加
xxxxxxx feature: 計算ツールを追加
xxxxxxx chore: .gitignoreを追加

プルリクエストのマージコミットを含む4つのコミットが表示されています。GitHubでのマージにより「Merge pull request」というコミットが自動的に作成されるため、ローカルでのコミット数よりも1つ多くなっています。

💡 ポイント
このハンズオンでは、ローカルでの基本操作からGitHubを使ったチーム開発の流れまでを一通り体験しました。実際のチーム開発でも、「ブランチを作成 → 変更をコミット → プッシュ → プルリクエスト → レビュー → マージ」というサイクルを繰り返して開発を進めます。この流れに慣れておくことが、チーム開発にスムーズに参加するための第一歩です。

10. まとめ

このハンズオンでは、GitとGitHubを使った開発の基本的な流れを体験しました。

  • git initでリポジトリを初期化し、.gitignoreで不要なファイルを除外する
  • git addとgit commitでファイルの変更を記録する
  • git pushでローカルの変更をGitHubに送信する
  • ブランチを作成して機能を追加し、プッシュする
  • GitHub上でプルリクエストを作成し、変更内容を確認してマージする
  • git pullでリモートの変更をローカルに反映する