There is perhaps some wisdom in the saying “Don’t sh** where you eat.” Fortunately, no one ever said, “Don’t Git where you code” — and a good thing too. Since its launch in 2015, Visual Studio Code has taken the world by storm (no, not you WebStorm).

Of its ever-growing repertoire of extensions and features, its integrated source control management — Git in particular — has to be one of the most useful.

And although I mainly rely on the command line when using Git, I’ve come to use more and more of VS Code’s Git features. There are many VS Code extensions that provide different Git functionalities.

Here, I’ll be focusing on the editor’s built-in source control view and, to a lesser extent, the GitHub extension. Be sure to check out the resources at the end for a comprehensive list of features.

The source control view is the go-to spot for most Git-related tasks. Not only does it provide a live overview of changes in the workspace, but it will also show changes across multiple workspaces if files from more than one are open in the same editor window.

VS Code’s GitHub extension needs to be installed manually and allows for tasks such as cloning, publishing, merging, and managing PRs.

The following are some of the tasks I most commonly use them for along with their command-line interface equivalents. All of these actions are also available through the command palette (Ctrl+Shift+P).

Stage and Commit

Staging made simple. Unstaging is also possible by clicking the minus button after staging a file.

CLI-equivalent: git add → git commit

View changes

Tip: you can toggle side-by-side or inline diff using the three dots in the top-right corner

CLI-equivalent: git diff -- <file-path>

Re-use commit messages

By using the up and down arrows, you can navigate through previous commit messages to save time

Undo changes

CLI-equivalent: git checkout HEAD -- <file-path>

Compare file changes between adjacent commits (GitHub extension)

CLI-equivalent: git diff <commit>~ <commit> -- <file-path>

Create and switch branches

Tip: VS Code’s Git Graph extension provides a visual reference for your project’s branches and will show up in the source control view once installed

CLI-equivalent: git checkout [-b] <branch>

Publish to GitHub

Once the repo has been published to GitHub (or if a remote repository is already linked to your local project), the same button can be used to sync changes with remote.

Clone (GitHub Extension)

This option will appear in the explorer view when a new VS Code window is opened

CLI-equivalent: git clone <remote-URL>

Bonus: Emojis

If you’re like me and like to use emojis to add flair to your commit messages, Gitmoji is a great extension that helps you choose a matching emoji for your commit from right inside VS Code instead of perusing the online list.

On the other hand, if you’d rather have complete flexibility with the choice of emoji, :emojisense: provides auto-completion and generally makes using emojis a cinch.

This is only scratching the surface. Other cool Git things you can do in VS Code include creating issues and pull requests, stashing, and much more.

I’d love to hear your thoughts as well as any tips and tricks you use.

Originally published on Medium.com