Manage GitHub Gists in VS Code

Normally when I'm creating a code snippet, it's to accompany, accompany, accompany, not to speak English. Hello world, my name is Michael Jolley. I'm the Bald Bearded Builder and today we're talking about Versus Code extensions.

Today I wanna talk about Gist, an extension that allows you to manage your GitHub Gist from within Versus Code. If you're not familiar with GitHub GIS, they're basically light versions of GitHub repositories. They have things like version control, stars, comments, but they're missing extras like issues, pull requests, and actions. Before we move on, just a quick reminder that if you enjoy learning more about developer tools, new technologies, or just hanging out with other developers, we stream live on Twitch Tuesday through Thursday at two Eastern seven UTC. You can check us out at twitch.

Tvbaldbeardedbuilder. Back to GitHub GISS. There are a lot of use cases, but we'll cover those in a later video. Today, I wanna focus on the most common use case of just saving code snippets or just little pieces of text that you wanna hold onto. GitHub provides a really nice interface for managing these, but I don't really wanna leave my code editor to save a code snippet.

Normally when I'm saving code snippets, it's to accompany some blog posts or other content I'm working on. Let's take my personal website as an example. It's written in Nuxt JS, which is basically a view based Next JS. I'm writing all my blog posts in markdown, so it would be really nice not to have to tab back and forth between Versus Code and a browser. And that's what the gist extension makes possible.

How do you install it? Well, as always, I've included a link in the description below, but by far the easiest way is to click on the extensions icon in Versus Code, search for gist, and then press the install button. Once it's installed, you'll need to authenticate with GitHub so that it can access your gist. We're gonna use a non enterprise account, and to get your personal access token, just open up github.com and then go to settings. In the left menu of settings, click on developer settings, and then in the menu you'll see personal access tokens.

Click the create token button and then enter a name for it. This is just a name that describes what you're using this token for. The only permissions you'll need are gists, and then you can press the generate token button. When you press that, it's gonna create a new token and show it to you. You'll wanna copy it right now because it will not show you that token again.

Once we've got the token copied, let's head back to Versus Code and we'll open the command palette again, and we'll search for just select profile. That will prompt you to enter your personal access token, so we'll paste that in, hit enter, then it's gonna ask you for a name of the profile. That doesn't matter, it's just a name that's easy to remember. Once you hit enter there, you're good to go. You're authenticated and ready to start accessing your GitHub GISTs.

To create a new GISTs, just use command or control plus N to open up a new window. You can paste in any kind of snippets or text that you wanna save, and then use the command palette again to choose gist, create new gist. This is gonna ask you for a file name, and I really recommend adding an extension because that way Versus Code will give you IntelliSense when you're working with it. Then it'll ask for a description. This is optional, but it provides you a way to remember what this snippet's about.

Finally, it'll ask you if you want this just to be public or private. Use a Y for public or an N for private. Then once it's saved, a dialog window will open giving you the option to open that gist in a browser or to copy the URL. We won't go into the whole how to open or how to delete options. They're both in the command palette.

You can find them fairly easily and we'll let you explore that for yourself. One feature I do wanna talk about though because it's so powerful is the ability to insert text from a gist. So imagine you have some kind of code comment that you want at the top of all your files or a certain format for tests that you always want to have that structure in place. In this case, I've saved the comment that I want to insert at the top of all my C files. I'm going to use the same C gist that we created a minute ago, and I'm going to click where I want this new comment added.

Then I'm gonna open the command palette and choose Gist insert text from Gist file. That's gonna present me with a list of all of my public and private Gist that I can choose from. Select the one I want and it'll insert the text of that Gist into my open document. Isn't that cool?

Now there's also several configuration options, but I only really wanna discuss one. It's the ability to default all of your new gist to being private or public. In my case, 95% of my GISTs are private, so I don't wanna have to type in over that every time. So we can go into our settings and then do a search for GISTs, that'll give us all the options, and then there's one on there for default private. If we check that box, anytime we save a new gist, it's gonna default to private for us and give us the option to flip it to public if we need.

It is so nice to be able to manage my GitHub gist inside of Versus Code. I get the power of IntelliSense, but also the power of Git source control. I'm always on the lookout for new extensions or ways to improve my productivity. Are there extensions that you're really into that you just can't live without? Let me know in the comments below.

And if you want to learn more about extensions or productivity tips or developer tools, be sure to hit the subscribe button and hit the bell to know when we release a new video. Until next time.