GitHub Codespaces
is a great way to make it easier for people to contribute to your project. With a few clicks, folks can spin up a Codespace environment with all necessary tooling installed and be productive right away. But it does take a few clicks and this quick post is to show how you can save developers a click or two because every click matters 😆
With one line of markdown in your README, you can add a button that looks like this…
To add the button, you’ll first need to get your GitHub repo’s ID. The GitHub repo ID is not obvious to find, but you can use the
GitHub CLI
to retrieve it.
Run a command like this from the root of your repo and make sure to replace
Azure-Samples/aks-store-demo
with your
org/repo
.
gh api repos/Azure-Samples/aks-store-demo --jq '.id'
From there, all you need to do is add the following line to your README, like this…
[![Open in GitHub Codespaces](https://github.com/codespaces/badge.svg)](https://github.com/codespaces/new?hide_repo_select=true&ref=main&repo=648726487)
Notice the query parameters
ref
and
repo
in the URL above. Make sure you replace
648726487
in the code above with your repo’s ID and set
ref
to whatever branch you want to open the Codespace in as it will currently open in the
main
branch.
That’s it! Now when someone visits your repo, they’ll see a button at the top of the README that they can simply click to open a Codespace for your repo. 🎉