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に必要な機能はここにひと通り揃っています。


JavaScriptのテンプレートリテラル内で条件分岐を行う方法
Vue.jsのv-forで生成した要素をクリックするたびに、classをトグルで付け外しする方法
JavaScriptで配列内から特定条件の要素を探す方法
JavaScriptのtest関数と正規表現でバリデーションチェックを行う
アイコンフォントをPCにインストールしている場合は、コーディング後の確認に注意
Nuxt.jsでページを作成・追加する方法|Nuxt.jsの基本
JavaScriptで特定のOSやブラウザの判定を行う方法
gulp-plumberとgulp-notifyでgulpエラー時にデスクトップで通知がくるようにする
Google Maps APIを使ってGoogle Mapsをウェブサイトに表示させる方法
AirPodsで片耳を外しても再生が止まらないようにする方法
MacのKeynoteにハイライトされた状態でコードを貼り付ける方法
iTerm2でマウスやトラックパッドの操作を設定できる環境設定の「Pointer」タブ
DeepLで「インターネット接続に問題があります」と表示されて翻訳できないときに確認すること
Ulyssesの「第2のエディタ」表示を使って2つのシートを横並びに表示する
定番のパスワード管理ツール「1Password」を使ってパスワードの管理をする
iTerm2終了時に表示される確認ダイアログを非表示にする
Alfred 4で使えるシステムコマンドのまとめ
Figmaのパス周りの基本操作|基本的な描画方法からペンツールと直線ツールの細かい違いまで
Figmaで作ったスマホデザインを「Mirror」機能を使ってリアルタイムに実機確認をする
Figmaでデザインデータ上の画像を圧縮してファイルサイズを軽くする「Downsize」
GUIコンパイラのPreprosを使ってSassのコンパイルを行う
ATOKのマンスリーレポートで自分の入力した文字数や打ち間違いの傾向を確認する
Path Finderのファイル比較ツールをKaleidoscopeに変更する方法
js-cookieでウェブサイトのダークモード表示設定をユーザーごとに保存しておく方法