blog post banner image

Bring Feature Flags to Your IDE With the New VS Code Extension

Dan Holloran

9/15/2023

Managing feature flags often becomes the job of one singular person or team. But, feature flagging and experimentation are truly the responsibility of the entire business—from DevOps teams to product managers. Developers build the product but are also invested in seeing its success. Being forced to switch out of your coding environment to manage feature toggles and flags can force engineers to lose context and reduce developer efficiency. This is why we’re so excited to announce the DevCycle VS Code extension!

DevCycle is now fully integrated into VS Code, bringing seamless feature flag management right into the IDE. With DevCycle’s functionality integrated naturally across VS Code, the CLI, and the web dashboard, you can easily work where you feel most comfortable and make changes fast. Without even leaving VS Code, you can identify a stale feature flag or troubleshoot an existing problem with a feature in any environment and add, remove, or edit features and variables through the CLI.

This new feature release continues to show our dedication to building a developer-first feature flag management platform. So, to help you get more value, let’s dive into a few benefits and examples you can expect when leveraging the new DevCycle VS Code extension. If you’re just too eager to read on and want to get started, check out our VS Code extension documentation or sign up for a free trial to see it for yourself.

More time developing, less time troubleshooting

VS Code is a familiar environment for most developers. The navigation is easy and it’s a focused workspace for you to write code. The DevCycle VS Code extension does not clutter your IDE or distract you from the code. You can simply open the left menu navigation to find the Inspector, Variable Usages, and your Environments and SDK Keys.

  • The Inspector allows you to view all your feature flags. You can see a list of all variables existing within your code and project as well as search through your features and variables to view their status (Active or Inactive) across your environments.
  • Variable Usages will draw you in to show you where each of your DevCycle variables reside in your codebase, providing a convenient click-to-navigate experience.
  • In order to not interfere with your natural workflow, you can hover over DevCycle variables in your code to bring up a card with detailed information about the variable and the current status of the feature across environments.

With links back to useful documentation and the DevCycle web dashboard, alongside a unified experience between the VS Code extension and the CLI, you can seamlessly manage feature flags and toggles without stopping your development process. When an incident or an outage happens, you can find the feature or the variable quickly and navigate to it in one click, helping you find the code you need to review and making troubleshooting a breeze.

Avoiding context switching in the developer workflow

The IDE is a place that should be free of distraction. You don’t need a bunch of browser windows or tabs open, you just need a dedicated workspace to build new products and capabilities distraction-free. The new DevCycle VS Code extension allows you to avoid frequent context-switching when looking through your feature flags or adding new ones.

With the CLI in VS Code, you can investigate your entire catalog of feature flags and run commands to add, remove, edit, and take nearly any action to manage your features, variables, targeting rules, and variations. And, if you prefer the web dashboard experience, you can simply find the feature in the Inspector and click the “View in Dashboard” option to open your browser and bring you straight to the feature you want to see.

Screenshot of the DevCycle VS Code extension interface

Easy-to-find SDK keys and environments

Something simple but highly useful in the development workflow is an easy way to find SDK keys for each of your DevCycle environments. These are displayed front and center in the left navigation menu of the VS Code extension. If you’re sharing your screen and worried about sharing these keys, don’t worry, the info is abstracted and you can simply copy/paste these keys wherever you need to put them. This eliminates any need to navigate to the web dashboard or look up your keys through the CLI, they’re right there in your IDE, ready to go.

Seamless feature flagging in VS Code

We’re very excited to bring feature flag management directly into VS Code. While this is the first iteration of a very useful tool for all developers, we’re continuing to build it out to make it even more integrated, automated, and easy to use. Please check out our documentation for yourself to learn how you may leverage the VS Code extension or sign up for a free trial if you’re not already using DevCycle.

We welcome your feedback and encourage you to engage with us on Discord to ask any questions you may have or let us know what you think about this new feature! Thank you so much for making feature flag management an integral part of your development lifecycle. Happy feature flagging!

Written By

Dan Holloran