Need help with GatsbyHub?
Click the “chat” button below for chat support from the developer who created it, or find similar developers for support.

About the developer

165 Stars 10 Forks MIT License 503 Commits 2 Opened issues


Access everything Gatsby has to offer without ever leaving Visual Studio Code. This VSCode Extension allows you to generate a new Gatsby site using a starter, browse Gatsby plugins, and develop a server all with a click of a button.

Services available


Need anything else?

Contributors list

No Data

Korean README 한국어 | Japanese README 日本語

GitHub link GitHub license PRs Welcome VSCode Dev Slack


GatsbyHub is an open-source extension for Visual Studio Code that offers an interactive GUI for Gatsby-cli.

GatsbyHub allows you to browse Gatsby plugins, starters, and themes without ever having to leave VS Code. Create a blazing fast, modern app with a single click or check out the many Gatsby starter templates available. Start a hot-reloading development environment by simply clicking the status bar icon. Configure GraphQL queries using Gatsby's built-in instance of GraphiQL. For advanced customizations, please refer to the Gatsby docs and edit your user settings.


⚠️ Warning: This is beta software, which means there may still be bugs. Please report bugs and share your feedback. Currently GatsbyHub is only compatible with npm which affects how plugins, themes, and gatsby-cli are installed.

GatsbyHub is available to install in Visual Studio Marketplace.


Gatsby CLI GUI

Interact with Gatsby without ever having to use the command line interface. GatsbyHub provides buttons and options for all the most commonly used commands.

  • Install Gatsby - Installs the gatsby-cli npm package
  • Create New Site - Creates a new Gatsby site with the click of a button
  • Develop Server - Starts and stops a hot-reloading development environment by either clicking the button or clicking the status bar item
  • Build Site - Build and package your site so it's ready to deploy on Gatsby's cloud

Advanced Develop and Build options are available in the extension settings for things like setting up the host, port, toggling no-uglify, etc.

Gatsby Plugins and Themes

Find and download Gatsby plugins and themes without ever leaving VS Code.

Gatsby is known for it's active community and many plugins. You can find Gatsby's official plugins and all the documentation needed to implement them into your project. Selecting a plugin opens a webview within VS Code where you can read up on the plugin's README. Installing the plugin is as easy as clicking the download button in the sidebar.

Gatsby Starters

Use one of Gatsby's many Starter sites as a template for your site. Browse the starters and check out their READMEs. Creating a new Gatsby site is as easy as clicking a button in the sidebar and typing in a name for your site.


Access Gatsby's built-in instance of GraphiQL with a single click when running a development server. Writing GraphQL queries has never been this easy.

Extension Settings

Gatsby-Cli has a lot of advanced options for generating a development server and packaging your project. GatsbyHub provides a way to toggle these options within the VS Code extension settings. That way the settings persist every time you want to develop a server or package your app. No more typing out the same commands or configuring a script everytime you start a new project.

Release Notes

GatsbyHub 1.0.8 - November 13,2020

See the change log for the full set of changes


Brian 'B-Hash' Hayashi @github @linkedin

Dylan Hensel @github @linkedin

Joonyoung Kim @github @linkedin

Lucy Chi @github @linkedin

Miguel Michel @github @linkedin

Risa Hiyama @linkedin

We use cookies. If you continue to browse the site, you agree to the use of cookies. For more information on our use of cookies please see our Privacy Policy.