Visual Studio Codeでできる最低限のGit操作方法

Visual Studio CodeではデフォルトでGitの管理機能がサポートされています。
わざわざGitのGUIアプリと切り替えたり、ターミナルと行ったり来たりしなくてもいいので、こまめなコミットがしやすくなります。
今回はVisual Studio Codeを使った、最低限のGit操作方法についてまとめておきます(Gitはある程度理解している人向けの記事になります)。
Git SCMの表示
Visual Studio CodeでGit機能が使えるサイドバーのことをGit SCM(Gitソース管理マネージャー)と言います。
.gitフォルダが入っているフォルダをVisual Studio Codeで開くと、このGit SCMが使えるようになります。使いたいときは、サイドバーにある、道が枝分かれしたようなアイコンをクリックするか、control + shift + Gで表示ができます。

変更をコミット
コミットするまでの間はエディタでは変更した箇所に変更内容に応じた線が表示され、ファイルを変更して保存すると、Git SCMの「CHANGES」にファイルが溜まっていきます。
ファイルの「+」アイコンをクリックすると、ファイルステージへ移動できます。

コミットしたいファイルをひと通りファイルステージへ移動させたら、上の入力欄にコミットメッセージを入力して、command + enterを押すか、上のチェックマークを押すとコミットできます。
ブランチの作成や切り替え
ブランチの作成などはVisual Studio Codeの左下にある「master(現在のブランチ名)」をクリックすると、ブランチの作成や切り替えができる入力画面が表示されます。

ブランチ名を入力して「Create new branch…」を選択すると新規でブランチを作成できますし、ブランチ名を選択すればそのブランチに移動できます。
Git関連のメニュー
それ以外の機能に関しては、Git SCMのコミットメッセージ上にあるメニューから行えます。
Gitに必要な機能はここにひと通り揃っています。


WordPressのメディアライブラリで画像を追加するときに表示される「HTTP エラー」の解消方法
Visual Studio Codeのエクスプローラー上でファイル・フォルダの複製ができるようになる拡張機能「Duplicate action」
Nuxt.jsでのページ遷移設定方法(Vue Routerやnuxt-link)|Nuxt.jsの基本
gzip圧縮をしてウェブサイトの表示スピードを上げる方法
Nuxt.jsでコンポーネントを作成してコードの共通化を行う|Nuxt.jsの基本
Nuxt.jsでページを作成・追加する方法|Nuxt.jsの基本
Google Chromeでinput要素の補完機能を使うと背景に色がついてしまう問題
CSS疑似要素の「:empty」でタグの中身が空のときのスタイルを設定する
SourceTreeで環境設定の「カスタムアクション」「アップデート」「高度な設定」が選択できない
AirPodsで片耳を外しても再生が止まらないようにする方法
MacのKeynoteにハイライトされた状態でコードを貼り付ける方法
iTerm2でマウスやトラックパッドの操作を設定できる環境設定の「Pointer」タブ
DeepLで「インターネット接続に問題があります」と表示されて翻訳できないときに確認すること
Ulyssesの「第2のエディタ」表示を使って2つのシートを横並びに表示する
MacでOutlookの「.msg」拡張子のファイルを開く方法
Chrome拡張機能の「1Password」と「1Password X」の違いはなに?どちらを使えばいいの?
Figmaのパス周りの基本操作|基本的な描画方法からペンツールと直線ツールの細かい違いまで
コードスニペットの管理方法や命名規則について
Figmaでオブジェクトの整列をショートカットキーを使って効率的に行う方法
情報収集に最適!!RSSリーダー「Feedly」の登録から簡単な使い方まで
Path Finderを使ってキーボードだけでファイル操作する方法(基本操作編)
さくらのレンタルサーバで.htaccessが原因で500エラーになってしまう場合のチェックリスト
変換候補に出ないようにしておいた方が便利な単語や、カタカナにした方が読みやすい単語一覧
gulp-sass 5の「does not have a default Sass compiler」エラーを解消する