📝 はじめに

この記事では、開発に必須のGitHubと人気エディタVS Codeを連携させる方法を解説します。

まず、Git・GitHubを使う上で欠かせない基本的な用語を解説し、その上でVS Codeを用いた具体的な操作手順を紹介します。

この記事の対象者

GitやGitHubの用語の意味が曖昧な方
GitHubアカウントは持っているが、VS Codeからの操作方法がわからない方
ターミナル操作を避け、VS Codeでバージョン管理を完結させたい方

💡 1. Git/GitHubの基本用語を理解する

GitとGitHubで使われる重要な用語を理解しておきましょう。

用語	読み方	意味
リポジトリ	Repository	プロジェクトのファイルと、その全ての変更履歴を保存する場所（倉庫）。ローカルPC上のものをローカルリポジトリ、GitHub上のものをリモートリポジトリと呼びます。
コミット	Commit	ファイルの変更を履歴として記録・確定する作業。いわば「セーブ」です。
ステージング	Staging	変更したファイルをコミット対象として一時的に準備する作業。コミットする変更を選ぶために使います。
ブランチ	Branch	開発を並行して行うための作業の分岐。メインの開発（通常は`main`など）に影響を与えずに新機能開発などを行うときに使います。
プッシュ	Push	ローカルリポジトリでコミットした履歴を、リモートリポジトリ（GitHub）に送り出す作業。
プル	Pull	リモートリポジトリ（GitHub）の最新の変更履歴を、ローカルリポジトリに取り込む作業。
フェッチ	Fetch	リモートリポジトリの最新情報をローカルに取得するが、ローカルの作業ファイルは更新しない作業。Pullと違い、ローカルの変更に影響を与えません。
マージ	Merge	分岐したブランチの変更内容を、別のブランチに合流させる作業。
プルリクエスト / マージリクエスト	Pull Request (PR) / Merge Request (MR)	ブランチのマージを提案し、レビューを依頼するための機能。（PRはGitHub、MRはGitLabなどで使われる用語です。）

💻 2. 事前準備

2-1. 必要なもの（インストール・アカウント作成）

VS Code（高機能なコードエディタ）：Visual Studio Code公式からダウンロード
Git（バージョン管理システム）：Git公式サイトからダウンロード
GitHubアカウント（リモートリポジトリ）：GitHub公式サイトでアカウント作成

2-2. VS CodeとGitHubの連携（初期設定）

VS Codeの**「ソース管理」**ビュー（三つ又のアイコン）を開きます。
初回利用時、「GitHubへのサインイン」が求められたら、指示に従って認証を完了させます。

⚙️ 3. VS Codeで実践する開発ワークフロー

3-1. リポジトリのクローン

既存のGitHubリポジトリをローカルPCにコピーする（クローン）操作をVS Codeで行います。

コマンドパレット (Ctrl+Shift+P または Cmd+Shift+P) を開きます。
「Git: Clone」と入力し、選択。
クローンしたいGitHubリポジトリのURLを入力（またはGitHubから選択）。
ファイルを保存するローカルフォルダを選択。
クローン完了。

3-2. ステージングとコミット（変更内容をローカルリポジトリに反映）

ファイルの変更は、VS Codeの「ソース管理」タブで管理します。
（今回はREADME.mdの変更があったと仮定します。）

ステージング: 変更ファイルの横にある「＋」ボタンをクリックし、ステージングします。
※ステージングする際に変更箇所を確認すること
コミット: 上部にあるテキストボックスにコミットメッセージを入力し、チェックマークのコミットボタンを押して履歴を記録（コミット）します。
※「コミットしてプッシュ」でローカルリポジトリに変更内容を反映＆リモートリポジトリにローカルリポジトリの変更内容の反映を一括で行うことも可能。

3-3. GitHubへの反映（PushとPull）

操作	目的	VS Codeでの操作
Push (送り出す)	ローカルのコミットをGitHubにアップロード	ソース管理ビューの「プッシュ」ボタン、または画面右下の雲のアイコン（⬆️）をクリック。
Pull (取り込む)	GitHubの最新の変更をローカルに取り込む	ソース管理ビューの「プル」ボタン、または画面右下の同期アイコン（🔄）をクリック。

🤝 4. 共同開発への応用（ブランチとマージ）

4-1. ブランチの作成と切り替え

画面下部のステータスバー（通常はmainと表示されている箇所）をクリックすると、ブランチの作成や切り替えが簡単に行えます。

4-2. プルリクエストとマージ (Pull Request)

開発が完了したら、メインブランチへ合流（マージ）するために**Pull Request (PR)**を作成します。

VS Codeの拡張機能（例：GitHub Pull Requests and Issues）などを使ってPRを作成します。
PRがレビューされ、承認されると、変更がメインブランチに**合流（マージ）**されます。

✨ まとめ

Gitの基本用語を理解し、VS Codeのソース管理ビューを使うことで、Gitコマンドを覚えることなく、GitHubを活用した効率的な開発が行えます。

まずはこの記事を参考に、クローン → コミット → プッシュ の一連の流れをVS Codeでマスターしましょう！

関連リンク