【VSCode】プラグイン「Git Graph」

ブランチや履歴がビジュアルでかくにんできます。

リポジトリをクローンする

GitHubで下記の通りコピー

ターミナルでコピーしたコードを使用

git clone コピーしたコード

ブランチの切り方

サイドの「ソース管理」のアイコンをクリックし、「View Git Graph」をクリックするとGit Graphのタブが表示されます

用語補足

  • origin:デフォルトのリポジトリ、リモートリポジトリ
  • master: デフォルトのブランチの名前
  • rv(リビジョン):「修正」「改訂」

【Git】ブランチ命名規則と開発効率化【7つのベストプラクティス】
https://takeda-no-nao.net/programming/git/git-branch-naming-convention

Graphの列「右の空いたスペース」を右クリック、「Create Branch」をクリック

表示されたウィンドウで「ブランチ名」を入力、作成したブランチに切り替える場合「Check out」にチェックし「Create Branch」をクリック

ブランチの切り替え

例:「main」から「rv_front_01」に移動したい場合

1)移動先のブランチで右クリック

2)Checkout Branchをクリック

3)チェックアウト先のブランチ名が入力されていますが、そのまま「Checkout Branch」をクリック

4)「その名前がすでにリポジトリ内の別のブランチで使用されている」とメッセージがでますが、新しいブランチを作成するわけではなく既存のブランチへのチェックアウトなので、「Checkout the existing branch & pull changes」をクリック

マージする手順

例:現在いる「mainブランチ」に「rv_front_01ブランチ」をマージする場合

「rv_front_01」→「mainブランチ」

(開発、修正を行ったブランチを、メインのブランチ(通常「main」や「master」)にマージする一般的な方向)

1)マージさせるブランチ(main)に移動

2)マージするブランチ(rv_front_01)で右クリック→「Marge into current branch」をクリック

3)Yes, mergeをクリック

“Create a new commit even if fast-forward is possible”

意味:高速転送(fast-forward)が可能な場合でも、新しいコミットを作成する

  • 通常、マージ先のブランチが直線的に進んでいる場合、Gitは「高速転送」を行い、新しいコミットを作成せずにポインタを移動させます。
  • このオプションをチェックすると、高速転送が可能な場合でも強制的に新しいマージコミットを作成します。
  • 履歴にマージの記録を明示的に残したい場合に使用します。

“Squash commits”

簡単に言うと複数の変更をひとまとめにする(コミットを圧縮する)

→細かい作業の履歴をすっきりさせたい時

“No commit”

マージの結果を確認してから自分でコミットする

  • マージの結果をワーキングディレクトリとステージングエリアに反映しますが、自動的にコミットは作成しません。
  • git merge --no-commit コマンドと同等の動作をします。

注意 コンフリクトについて

コンフリクトは、複数の開発者が同じファイルの同じ部分を異なる方法で変更した際に発生する問題です。

同じコードベースに対して、異なるブランチで相反する変更が行われた状態。 発生状況:

  • 複数の開発者が同じファイルを同時に編集
  • ブランチをマージする際に、両方のブランチで同じ部分が変更されている

結果:GitHubは自動的にマージできず、手動での解決が必要になります。

GitGraphで「リモートリポジトリでプロジェクトが進んでおりローカルの遅れている分の際をなくす」手順

VSCodeを開き、該当のプロジェクトを開きます。 GitGraphを開きます:

  • 左側のアクティビティバーで、GitGraphのアイコン(通常は枝分かれした線のアイコン)をクリックします。
  • もしくは、コマンドパレット(Ctrl+Shift+P または Cmd+Shift+P)を開き、”GitGraph: View Git Graph”と入力して選択します。

GitGraphで現在の状態を確認します:

  • ローカルブランチとリモートブランチの位置の差を視覚的に確認できます。

リモートの変更を取得します:

  • GitGraphの上部にある「Fetch」ボタンをクリックします。
  • これにより、リモートの最新の変更情報がローカルに取得されます(まだマージはされません)。

変更をマージまたはリベースします:

  • 現在のブランチ(例:main)を右クリックし、以下のいずれかを選択します: a. 「Merge into current branch」: リモートの変更をマージします。 b. 「Rebase current branch」: 現在のブランチをリベースします。
  • 通常、リモートの変更を取り込むだけであれば「Merge」が適しています。

コンフリクトが発生した場合:

  • VSCodeがコンフリクトを検出し、解決するためのインターフェースを表示します。
  • 各コンフリクト箇所で適切な変更を選択または編集します。
  • すべてのコンフリクトを解決したら、変更をステージングし、コミットします。

プッシュ:

  • コンフリクトを解決しマージが完了したら、GitGraphの「Push」ボタンをクリックしてローカルの変更をリモートにプッシュします。

確認:

  • GitGraphで再度ブランチの状態を確認し、ローカルとリモートが同期していることを確認します。

参考サイト

【GitのGUIツール】Git Graphのわかりやすい使い方
https://zenn.dev/nenenemo/articles/41e92a92693b01