VS CodeでGit操作｜コマンド不要の初心者ガイド

導入

「Gitって難しそう…」「黒い画面にコマンドを打つのは怖い…」と思っていませんか？

実は、VS Codeを使えばGitの操作はすべて画面上のボタンクリックでできます。コマンドを1つも覚える必要はありません。

この記事では、VS CodeのGUI（画面操作）だけでGitを使う方法を解説します。リポジトリの作成からGitHubへのプッシュまで、ステップバイステップで進めます。VS Codeをインストール済みなら、すぐに始められます。

Gitとは？なぜ必要？

Git（ギット） とは、ファイルの変更履歴を記録・管理するツールです。これをバージョン管理と呼びます。

ゲームに例えると、Gitは「セーブポイント」を作る仕組みです。

• セーブポイントを作れば、いつでもその時点に戻れる
• 複数のセーブデータを残せる
• 「いつ」「何を」変えたかが記録される

プログラミングでは、コードを書き進めるうちに「さっきの状態に戻したい」と思うことがよくあります。Gitがあれば、過去の好きな時点に戻れます。まさに「タイムマシン」です。

事前準備

Gitがインストールされているか確認する

• VS Codeを開きます
• 上部メニューの「ターミナル」→「新しいターミナル」をクリックします
• 表示されたターミナルに git --version と入力してEnterを押します
• 「git version 2.xx.x」のように表示されればOKです

表示されない場合は、Git公式サイト（https://git-scm.com/）からインストールしてください。

ユーザー名とメールアドレスを設定する

Gitを初めて使うときは、名前とメールアドレスの登録が必要です。ターミナルに以下を1行ずつ入力します。

git config --global user.name "自分の名前"
git config --global user.email "自分のメールアドレス"

この設定は最初の1回だけです。以降はすべてGUI操作で進めます。VS Codeの基本セットアップと一緒に済ませておきましょう。

基本操作1: リポジトリの作成

リポジトリ（repository） とは、Gitが変更履歴を保存する「倉庫」のことです。プロジェクトごとに1つ作ります。

手順

• VS Codeで「ファイル」→「フォルダーを開く」をクリックします
• Gitで管理したいプロジェクトフォルダを選びます
• 左側のサイドバーにある「ソース管理」アイコン（枝分かれした線のマーク）をクリックします
• 「リポジトリを初期化」ボタンが表示されるので、クリックします

これでリポジトリが作成されました。フォルダ内に .git という隠しフォルダが作られ、ここに変更履歴が保存されていきます。Gitの基本用語も確認しておくと理解が深まります。

基本操作2: 変更をコミットする

コミット（commit） とは、現在の状態を「セーブポイント」として記録する操作です。Gitで最も重要な操作です。

手順

• ソース管理タブを開きます（左サイドバーの枝分かれアイコン）
• 「変更」の一覧に、変更されたファイルが表示されています
• 記録したいファイルの横にある「＋」ボタンをクリックします。これをステージングと言います。「セーブ対象に選ぶ」操作です
• すべてのファイルをまとめてステージングしたい場合は、「変更」の横にある「＋」ボタンをクリックします
• 上部のテキストボックスにコミットメッセージを入力します。「何を変えたか」を短く書きます（例：「トップページを作成」）
• 「✓」（チェックマーク）ボタンをクリックします

これでコミット完了です。セーブポイントが1つ作られました。

コミットメッセージのコツ

• 「何をしたか」がわかるように書く
• 例：「ヘッダーのデザインを変更」「お問い合わせフォームを追加」
• 「更新」「修正」だけでは後から見てわかりません

ファイルを変更するたびにコミットする習慣をつけましょう。こまめにセーブポイントを作るのがGitの基本です。

基本操作3: 変更履歴を見る

タイムラインビュー

• 履歴を見たいファイルをエディタで開きます
• 左下の「タイムライン」パネルを確認します（表示されていない場合は「表示」→「タイムライン」で表示）
• コミットの一覧が時系列で表示されます
• 任意のコミットをクリックすると、その時点での変更内容が表示されます

差分（さぶん）表示の見方

差分表示では、変更前と変更後が左右に並んで表示されます。

• 赤色の行：削除された行
• 緑色の行：追加された行

「前回のセーブポイントから何が変わったか」が一目でわかります。これがGitの「タイムマシン」機能です。

基本操作4: GitHubにプッシュする

GitHub（ギットハブ） は、Gitのリポジトリをインターネット上に保存できるサービスです。プッシュ（push） とは、ローカル（自分のPC）の変更をGitHubに送る操作です。

手順

• ソース管理タブを開きます
• 上部の「...」メニューをクリックし、「リモートの追加」を探します。または、VS Codeが「ブランチの発行」ボタンを表示している場合はそれをクリックします
• 「GitHubに発行」を選択します
• GitHubアカウントへのサインインを求められたら、画面の指示に従ってサインインします
• リポジトリ名を確認し、「公開（Public）」か「非公開（Private）」を選びます
• 「OK」をクリックすると、コードがGitHubにアップロードされます

以降は、新しいコミットを作ったあとにソース管理タブの「同期」ボタンを押すだけでGitHubに反映されます。

GitHubにコードを置けば、GitHub Pagesでサイトを公開したり、デプロイの設定をしたりできます。

よくある質問3つ

Q1: コミットとセーブ（保存）の違いは？

ファイルの「保存」（Ctrl+S）は、ファイルの内容を上書きするだけです。前の状態には戻れません。

「コミット」は、その時点の状態を履歴として記録します。何回でも過去の状態に戻れます。

つまり、保存は「上書き」、コミットは「セーブポイント作成」です。両方を使い分けましょう。

Q2: 間違えてコミットしたらどうする？

VS Codeのソース管理タブで、直前のコミットを取り消せます。

• ソース管理タブの「...」メニューをクリックします
• 「コミット」→「前回のコミットを元に戻す」を選びます

これで直前のコミットが取り消され、変更がステージング状態に戻ります。ファイルの内容は消えないので安心してください。

Q3: .gitignoreって何？

.gitignore（ギットイグノア） は、Gitに「このファイルは無視してね」と伝えるためのファイルです。

たとえば、パスワードが書かれたファイルや、自動生成される一時ファイルはGitに記録したくありません。.gitignore ファイルにファイル名を書いておけば、Gitの管理対象から除外されます。

プロジェクトのルートフォルダに .gitignore というファイルを作り、無視したいファイル名を1行ずつ書きます。

まとめ

コマンドを覚えなくても、Gitは使えます。まずはGUI操作に慣れましょう。