Back to Projects
Last reviewed

Follow the branches / Selected work

Git Navigator

VS Code sidebar extension that handles everyday git and GitHub workflows — staging, commits, stashes, conflict resolution, blame, a visual commit graph, and pull requests — without leaving the editor or touching the terminal.

Git Navigator editorial concept artwork
Published on Visual Studio Marketplace
Concept artwork / Follow the branches

01 / The project

Behind the work.

Git Navigator is a VS Code extension published on the Visual Studio Marketplace as "Git Navigator Pro". It surfaces day-to-day git and GitHub work in a single, opinionated sidebar panel: a staged/unstaged Changes view with per-file and bulk actions, an inline commit input with Ctrl+Enter, a one-click pull-then-push Sync, a branch switcher backed by VS Code's QuickPick, and a webview-rendered commit graph with colour-coded lanes, paginated history, and rich metadata per row. Pull request creation runs through VS Code's built-in GitHub OAuth, so users never need to manage a personal access token. The current source also includes stash management, guided conflict resolution, line blame, file history, branch comparison, and a multi-repository picker. These describe the development source; the Marketplace listing is the public installation route.

02 / Interactive studio / Illustrative demo

See where the work branches.

Select a branch in the example history.

main

The shared history.

Browse commits and see where work comes together.

Illustrative history / no repository modified

03 / The build

Details that matter.

01

Published on the Visual Studio Marketplace as "Git Navigator Pro", built in TypeScript and bundled with esbuild.

02

Implemented a custom commit graph in a webview — colour-coded branch lanes with SVG connectors, paginated 50-at-a-time history, and per-row commit metadata.

03

Used VS Code's built-in GitHub OAuth for PR creation so users never need to handle a PAT, with `owner/repo` auto-detected from the configured remote.

Core

TypeScript / VS Code Extension API / esbuild / Node.js

Sidebar UI

QuickPick / Tree View / Status Bar Item / Webviews

Git Workflows

Init / Link Remote / Clone / Stage / Unstage / Discard / Inline Commit / Sync (pull-then-push) / Branch Switcher

Commit Graph

SVG Lane Rendering / Paginated History / Branch / Tag Refs / Relative Date Formatting

GitHub Integration

VS Code GitHub OAuth / Pull Request Creation / Auto-detected owner/repo

Reactivity

.git/index Watcher / .git/HEAD Watcher / Status Bar Branch Indicator

Have a related challenge?

Let’s talk about your project.

Tell me what you are trying to build, who it is for, and what a useful result would look like.

Discuss a similar project