はじめに

今更ながら、初めてVScodeでGitHubと連携して開発をしました。
そこで、GitとVScodeの連携方法を調べていたのですが、なかなかコマンドだけで操作を完結させる方法がなかったため、この記事でまとめることにしました。(GUIでの操作でもいいのですが、慣れてくるとコマンド操作の方が速いのでGUIは少し煩わしいからですw)

記載すること

Gitの簡易的な説明・用語
Gitの基本的な操作コマンド(リポジトリ作成～リモートリポジトリとの連携）
その他の便利な操作コマンド
コマンド一覧↓
コマンド一覧表

Gitとは？

Gitは、バージョン管理システムと呼ばれるものです。難しそうに聞こえるかもしれませんが、簡単に言うと「ファイルの変更履歴を記録してくれる便利なツール」です。

例えば、あなたが書いた文章を編集するたびに、前のバージョンを保存しておきたいとしますよね？ Gitを使えば、自動的にそれができます。しかも、単に保存するだけでなく、「誰が」「いつ」「どこを」変更したのかも記録してくれます。

Gitの概念があまり分からないよーという方は以下の動画で詳しく解説しているのでこれを見ると良いと思います！

Gitのすごいところ：

過去に戻れる: 間違えてファイルを消してしまっても、過去のバージョンに戻せます。
みんなで協力できる: 複数人で同じファイルを編集しても、Gitが調整してくれます。
安心安全: ファイルのバックアップにもなります。

Gitの基本用語

リポジトリ (Repository): ファイルやフォルダ、そしてそれらの変更履歴をまとめて保存する場所です。あなたのプロジェクトの「保管庫」みたいなものです。リポジトリには、自分のPCにある「ローカルリポジトリ」と、インターネット上にある「リモートリポジトリ」の2種類があります。
コミット (Commit): ファイルの変更をリポジトリに記録することです。「変更内容を保存！」みたいなイメージです。コミットするときには、「どんな変更をしたのか」を説明するメッセージ（コミットメッセージ）を書くことが大切です。
ブランチ (Branch): 開発の流れを枝分かれさせることです。例えば、新しい機能を作るときに、メインのコードを壊さないように、枝分かれしたブランチで作業します。
マージ (Merge): 枝分かれしたブランチを、元の流れに戻すことです。新しい機能が完成したら、メインのブランチに合流させます。
インデックス (Index) / ステージングエリア (Staging Area): 「次のコミットで保存する変更内容」を一時的に置いておく場所です。変更したファイルの中から、「これとこれは保存したい」というものを選んで、ここに置いておきます。
ワーキングディレクトリ (Working Directory): 実際にファイルが存在する場所です。あなたが普段作業しているフォルダのことです。
リモートリポジトリ (Remote Repository): インターネット上にあるリポジトリのことです。GitHub、GitLab、Bitbucketなどが有名です。ローカルリポジトリと連携することで、他の人とファイルを共有したり、バックアップを取ったりできます。

Gitのインストールと設定

インストール:

Gitを使うには、まず自分のPCにGitをインストールする必要があります。

初期設定:

インストールが終わったら、ターミナルを開きます。
VScodeの場合は「Terminal」＞「New Terminal」で開きます。

以下の画面が出るので、コマンドを打っていきます。

PS C:\XXX\XXX\>

最初に、Gitに自分の名前とメールアドレスを教えてあげる必要があります。名前は自分だと分かれば何でもOKです。

git config --global user.name "自分の名前"  # 例: git config --global user.name "山田太郎"
git config --global user.email "自分のメールアドレス" # 例: git config --global user.email "taro.yamada@example.com"

これは、「誰が変更したのか」を記録するために必要な情報です。

設定内容を確認するには、以下のコマンドを実行します。

git config --list

Gitの基本的な操作

1. ローカルリポジトリの作成と削除

既にローカルに作業フォルダがある場合にはスキップしてOKです。

新しいリポジトリの作成:

mkdir プロジェクト名  # 新しいフォルダ（プロジェクト）を作成
cd プロジェクト名    # 作成したフォルダに移動
git init             # このフォルダをGitで管理する

目的： プロジェクトのバージョン管理を始めるために、PCの中にGitの「保管庫」を作ります。

ローカルリポジトリの削除:
```
rm -rf プロジェクト名  # フォルダごと削除！ (注意: 復元できません)
```
目的： もう使わないプロジェクトの「保管庫」を削除して、PCの中を整理します。

2. コミット

コミットの目的： ファイルの変更をリポジトリに記録し、バージョン管理の基礎を築きます。コミットメッセージは、後で変更履歴を追跡する際に重要な情報源となります。

変更の追跡:
```
git status           # 今、どんなファイルが変更されている？
```
目的： ファイルを編集したときに、Gitが「変更があったよ！」と教えてくれます。

インデックスへの追加:

git add ファイル名    # このファイルを「次の保存」の準備！ 例: git add index.html
git add .             # 今いるフォルダにある全部のファイルを「次の保存」の準備！

目的： 「どのファイルを保存するか」をGitに教えます。

コミットの実行:
```
git commit -m "変更内容の説明"  # 例: git commit -m "トップページのデザインを変更"
```
目的： 変更内容をリポジトリに保存します。「-m」の後ろには、どんな変更をしたのかを説明するメッセージを書きます。
コミット履歴の表示:
```
git log             # これまでの保存記録を見る
```
目的： いつ、誰が、どんな変更をしたのかを確認できます。

3. ブランチ

ブランチは、本流から枝分かれした開発ラインを作る機能です。

ブランチの作成:

git branch ブランチ名 # 例: git branch feature/login

ブランチの切り替え:

git checkout ブランチ名 # 例: git checkout feature/login

ブランチの作成と切り替えを同時に行う:

git checkout -b ブランチ名 # 例: git checkout -b feature/login

ブランチの一覧表示:
```
git branch
```

ブランチのマージ:

git checkout メインブランチ名  # マージ先のブランチに切り替え
git merge ブランチ名           # 指定したブランチを現在のブランチにマージ

ブランチの削除:

git branch -d ブランチ名  # ローカルブランチを削除 (マージ済みのブランチのみ)
git branch -D ブランチ名  # ローカルブランチを強制的に削除 (マージされていないブランチも削除可能)
git push origin --delete ブランチ名 # リモートブランチを削除

4. リモートリポジトリとの連携

リモートリポジトリ連携の目的: 作成したコードをGitHubなどのオンラインの場所に保存したり、他の人と共有したりするために、リモートリポジトリと連携します。

リモートリポジトリの追加:
```
git remote add origin リモートリポジトリのURL # 例: git remote add origin https://github.com/ユーザー名/リポジトリ名.git
```
目的： 自分のPCにあるリポジトリと、GitHubなどのオンラインのリポジトリをつなげます。「origin」というのは、GitHubのリポジトリのニックネームみたいなものです。
リモートリポジトリの確認:
```
git remote -v
```
目的： リモートリポジトリがちゃんと登録されているか確認します。
リモートリポジトリへのプッシュ:
```
git push origin main  # 今いるブランチの内容をGitHubに送る
```
目的： 自分のPCで保存した変更内容を、GitHubにアップロードします。デフォルトのGitHubのブランチの名前は「main」になります。
リモートリポジトリからのプル:
```
git pull origin main  # GitHubにある最新の内容を、自分のPCに持ってくる
```
目的： GitHubにある最新の変更内容を、自分のPCにダウンロードします。他の人が変更した内容もこれで取り込めます。
リモートリポジトリのクローン:
```
git clone リモートリポジトリのURL  # GitHubにあるリポジトリを、丸ごと自分のPCにコピー
```
目的： GitHubにあるプロジェクトを、自分のPCにダウンロードして、すぐに開発を始められます。

5. その他の便利なGitコマンド

変更の破棄:

git checkout -- ファイル名 # ワーキングディレクトリの変更を破棄
git reset HEAD ファイル名  # インデックス (ステージングエリア) からファイルを削除
git clean -df           # 追跡されていないファイルやディレクトリを削除 (注意: 復元できません)
git revert コミットID     # 特定のコミットを取り消す新しいコミットを作成
git reset --hard コミットID # 指定したコミットまで履歴を戻す (注意: 変更が失われる可能性があります)

stash:

git stash           # 変更を一時的に退避
git stash list      # 退避させた変更の一覧を表示
git stash apply     # 最後に退避させた変更を適用
git stash pop       # 最後に退避させた変更を適用し、退避リストから削除
git stash drop      # 最後に退避させた変更を削除

git stash コマンドは、現在のワーキングディレクトリの変更を一時的に退避させることができます。これは、別のブランチに切り替えたり、緊急の修正を行ったりする際に便利です。

diff:

git diff            # ワーキングディレクトリの変更を表示
git diff --cached     # インデックス (ステージングエリア) の変更を表示
git diff コミットID   # 特定のコミットからの変更を表示
git diff ブランチ名   # 特定のブランチとの差分を表示

git diff コマンドは、ファイル間の差分を表示します。

ワークフローの例

新しい機能の開発:
- git checkout main (メインブランチに移動)
- git pull origin main (リモートの変更を反映)
- git checkout -b feature/新しい機能 (新しい機能ブランチを作成して移動)
- コードを編集
- git add . (変更をインデックスに追加)
- git commit -m "新しい機能を追加" (コミット)
- git push origin feature/新しい機能 (リモートリポジトリにプッシュ)
- GitHubなどでプルリクエストを作成
バグ修正:
- git checkout main (メインブランチに移動)
- git pull origin main (リモートの変更を反映)
- git checkout -b fix/バグ修正の内容 (修正用ブランチを作成して移動)
- コードを編集
- git add . (変更をインデックスに追加)
- git commit -m "バグを修正" (コミット)
- git push origin fix/バグ修正の内容 (リモートリポジトリにプッシュ)
- GitHubなどでプルリクエストを作成

コマンド一覧表

コマンド	説明	例
`git init`	新しいGitリポジトリを作成する	`git init my-project`
`git clone`	リモートリポジトリをローカルにコピーする	`git clone https://github.com/user/repo.git`
`git status`	ワーキングディレクトリの状態を表示する	`git status`
`git add`	変更をインデックスに追加する	`git add index.html` / `git add .`
`git commit`	インデックスにある変更をリポジトリに保存する	`git commit -m "Initial commit"`
`git log`	コミット履歴を表示する	`git log` / `git log --oneline`
`git branch`	ブランチを作成、一覧表示、削除する	`git branch feature/new-feature` / `git branch`
`git checkout`	ブランチを切り替える	`git checkout feature/new-feature`
`git merge`	ブランチをマージする	`git checkout main` / `git merge feature/new-feature`
`git pull`	リモートリポジトリから変更をダウンロードして現在のブランチにマージする	`git pull origin main`
`git push`	ローカルリポジトリの変更をリモートリポジトリにアップロードする	`git push origin main`
`git remote add`	リモートリポジトリを追加する	`git remote add origin https://github.com/user/repo.git`
`git remote -v`	リモートリポジトリ一覧を表示する	`git remote -v`
`git stash`	変更を一時的に退避する	`git stash` / `git stash pop`
`git diff`	ファイル間の差分を表示する	`git diff`

まとめ

コマンドを覚えることでエディタからのGit操作も快適になるので、是非覚えていきましょう！
この記事が参考になれば幸いです。