A VS Code extension for GitLab: GitLab Workflow

Fatih Acet ·
Mar 1, 2018 · 3 min read

We recently did a survey within the Frontend team to see which tools we were using and how we were using them, in order to learn from one another and to build better development workflows. Through this survey, we determined that Visual Studio Code (VS Code) is the most used integrated development environment (IDE) within the team. This led to the idea for a GitLab extension for VS Code that could help reduce context switching and boost productivity.

Update: Read eight tips for using the GitLab VS Code extension and about how GitLab + VS Code can be used for extension development.

This is not a GitLab feature (we're actually working on building our own integrated web IDE), but the extension is a quick and easy way to perform a lot of useful actions you would usually visit GitLab.com to do, directly within your VS Code editor. Watch the demo below and read on for more about how I developed the extension.


First iteration of GitLab Workflow

This was my first attempt at writing a VS Code extension, and I wanted to build something simple as a first iteration. I built an extension that allowed users to see issues and merge requests assigned to them on GitLab.com. The detailed documentation and powerful APIs of VS Code enabled me to build my first version in less than two hours! It was an enjoyable experience.

Further iterations

This led to the creation of my second iteration: showing MR URLs, providing the pipeline status on the status bar, opening the current file and current MR on GitLab.com. I shared this second iteration with my fellow GitLab team-members on our internal Slack and received a lot of positive feedback. After that, I released new iterations and it got more than 5,000 installations in just a month. It was so well received that it was featured on the "Trending this week" section of Visual Studio Marketplace and is still currently being featured on the "Trending this month" section 🎉

GitLab Workflow on Visual Studio Marketplace

The current version of this extension allows you to:

See below for more tasks you can perform quickly with the extension.

GitLab Workflow Commands

You can find the source code here and see the extension on the Visual Studio Marketplace. You can read the documentation here and check the CHANGELOG here. There is also a Product Hunt page for the extension.

Photo by Iker Urteaga on Unsplash

“A @code extension for @GitLab: GitLab Workflow” – Fatih Acet

Click to tweet

Edit this page View source