【2025年版】GitHub超入門 #4 -ブランチで並行世界を作る&失敗時のタイムマシーン(Rollback)-

1. はじめに:脱・初心者への第一歩

「コードをいじってたら動かなくなった!元に戻したい!」「新しい機能を試したいけど、今の動いているコードを壊すのが怖い…」。そんな悩みを解決するのが今回の「ブランチ」と「ロールバック」です。

  • 今回のゴール:
    1. ブランチを切って、安全に実験できるようになる。
    2. 失敗した時、特定の過去の状態に瞬間移動(ロールバック)できるようになる。

2. 【概念】ブランチ(Branch)とは?

ブランチを操れるようになれば、複数人での共同作業がより効率的且つ安全に行えます。

  • 並行世界(パラレルワールド)を作る機能
    • メインの進行データ(mainブランチ)から、コピーのセーブデータを作って、そっちで実験するイメージ。
    • 実験が成功したらメインに統合(マージ)し、失敗したらその世界(ブランチ)を捨てれば、メインは無傷。

3. 【実践】VS Codeでブランチを使う

今回の記事では、VScodeで操作することを前提に紹介します。CUIで操作する場合は、以下の記事で紹介しています。

githubの使い方講座2025年度版 コミットを戻すrevartと元に戻すresetの使い方の紹介記事

【2025年版】GitHub超入門 #5 (CLI編) -コマンドラインで操るブランチと時空移動-

【2025年版】GitHub超入門 #4 (CLI編) -コマンドで操るブランチとロールバック- 拡張機能なし、コマンドライン(CLI)だけでGitを操作する方法。最新の git switch を使ったブランチ操作や、git log での履歴確認、reset/revert でのコードの復旧手順を解説。黒い画面での操作をマスターしたい人向け。

3-1.ブランチの作成

リポジトリの横の”…” からブランチ→新しいブランチの作成→ 名前を入力(例: feature-design-fix)。

クリックするだけで、新しいブランチに移動します。

3-2.ブランチでの作業

今回は、学習用なので、適当に変更してコミットしてみます。

コミットすると、先ほど作成したブランチにて、ファイルの同期がなされます。

グラフを見てみると、分岐しているのがわかりますね。この状態だと、feture-design-fixのブランチでのファイル操作は、mainに適用されず、その逆もしかりです。

また、ブランチを切り替えたいときは、左側の”SOURCE CONTROL”のブランチのアイコンをクリックしたら出てくるメニューで切り替え可能です。

3-3. ブランチの統合

ブランチでの開発がうまくいったら、メインに統合して、メインの世界線に編集を適用します。

※2025年版注釈: 本来はGitHub上で「Pull Request」を出してマージするのがチーム開発の基本ですが、個人の学習段階ではVS Code上でのマージでOKとします。

VSCode上のグラフ上で統合したいブランチを選択して、”marge”を選択、

ブランチの統合の仕方

確認のポップアップなどが出るので、間違いなければ“Yes marge”

マージできれば、ファイル等の変更がmainに適用されます。

4. 【緊急事態】過去に戻りたい!(ロールバック)

「修正してたら完全に壊れてしまった。昨日の状態に戻したい!」というときは、CUIなら、コミットidを参考にロールバックできます。VSCodeならグラフ上で戻りたい地点のcommitをクリックして revartをすれば戻れます。

【手順】ResetとRevert(リセットとリバート)

  • 方法① Reset(リセット):歴史を消して戻る
    • 「時間を巻き戻す」。戻った地点より未来の出来事は「なかったこと」になる。
    • 操作: Git Graphで戻りたい行を右クリック → Reset current branch to this CommitHard を選択。
    • 注意: 自分一人の作業なら便利だけど、チーム開発でやると他の人の作業履歴も消し飛ぶので注意。
  • 方法② Revert(リバート):打ち消しコミット
    • 「逆の操作をして相殺する」。歴史は消さず、「間違いを修正した」という新しい記録を残す。
    • 操作: Git Graphで消したいコミットを右クリック → Revert...
    • メリット: 安全。GitHubにPush済みの過去を直すならこっち。
コミットID(ハッシュ)とは

すべてのセーブデータ(コミット)には、a1b2c3d のような固有のIDが付いています。確認したいときは、cuiで “git log”と打てば、コミットIDが確認できます。

$ git log

commit 4eec2ac4f925a81c23d2sf92d8151a4ssseegaea (origin/main)
Author: tukumolog <tukumolog@gmail.com>
Date:   Sun Nov XX 02:07:40 2025 +0900

    make-new-file in main

# commit の後の 4e~~がcommit idです。

5. まとめ

VSCodeでの操作例をもとに、ブランチの使い方とロールバックの仕方を紹介しました。ブランチを使えば、どんなに破壊的な変更も怖くありません。Resetで完全に元に戻せることを確認できたと思います。

これで、Githubを使ったチーム開発、個人開発でも実験機能のテストが簡単になったとはずです。