Bald Bearded Builder
vscode/manage-github-pull-requests-and-issues-with-vs-code

Manage GitHub Pull Requests & Issues with VS Code

GitHub Pull Requests and Issues brings reviews, queries, local PR checkout, issue management, and TODO-to-issue workflows into Visual Studio Code.

Loads from YouTube when you press play

Transcript 7 topics

GitHub PRs and issues

0:00

And if you wanna see more Versus Code extension videos, hi. Hello world, my name is Michael Jolley and I'm the bald bearded builder. Let's talk Versus Code extensions. Do you find yourself context switching a lot between Versus Code and your browser as you're trying to look at GitHub pull requests or issues? If so, this extension is for you.

It's called GitHub pull requests and issues, great name. And it quickly allows you to review and comment on and approve pull requests or create and manage issues. Plus a couple of amazing features that if you master are gonna just be world changers for your experience. But before we get into deep, let me remind you, if you like hanging out with other developers and learning new things and just having a good time overall, join our Twitch stream. We're there Tuesday through Thursday at two Eastern seven UTC, twitch.

Tvbaldbreedbuilder. Hope to see you there. Now let's get back to the extension.

Signing in to GitHub

1:11

If you wanna install it, the easiest way is to click on that extensions icon and search for GitHub pull requests and issues and press that install button. But as always, I've left a link to the extension in the description below in case you wanna read more and check it out before, you know, try it before you buy it kind of thing. This extension is a little different than others and that it needs to be logged into GitHub to work. And right now it doesn't work with GitHub enterprise. But if you're just using normal GitHub, all you had to do is press that little account button at the bottom of your IDE, choose sign in to GitHub pull requests and issues.

That's gonna open a browser that allows you to authenticate with GitHub and say you approve this extension accessing your information. Once it does that, it'll take you back to Versus Code and you will be ready to go. So first let's start with pull requests.

Pull request workflows

2:01

One of the nice things about it is it has some predefined queries in there. These queries are just like the ones you would normally run-in GitHub. Things like show me the PRs that are waiting for my approval or PRs that I've created myself or pull requests that are assigned to me. They're already in there. You can click it, you can view it.

And then that's where the fun really happens. If you click on one, it allows you to click the description button and that description will let you add comments to your pull requests, just like you were in the browser. It lets you merge them, squash, do anything you wanna do and then delete the branch when you're done. It manages the whole process for you just like you were in the browser. The approval process works exactly like you'd expect.

You can comment on lines of code, request changes, approve it, all those sorts of things without leaving Versus Code. You know, there's times where you have a pull request that you think it looks okay, but you really need to run it locally to see for yourself. They've got you covered. There's a context menu option. If you right click on the pull request, you can choose checkout.

And then when you check it out, it'll pull that pull request down. You can run the code locally, fiddle with it all you want, and then make your decision on whether you wanna approve or request some changes to that PR. I mentioned the queries that are built in before, but one of the nice features is it allows you to add your own custom queries. So if you'll go into the settings, you can search for that. And there's like a GitHub pull request dot queries option.

You gotta do it in the settings JSON file, but all it needs is a label and a query. And the query is just that normal GitHub syntax that you would use in the browser when searching for things. If you're not familiar with that syntax, I've left a link in the description to that. I think I'd call it GitHub search syntax.

That'll help you get a little better at searching issues and pull requests for things like labels, assignees, closed versus open, all those sorts of things are in there. Okay, let's switch over to issues.

Issue management

4:01

As if pull requests weren't enough, the nice thing about issues is they have those same kind of built in queries, things like assigned to me, created by me, all that sort of stuff. But just like pull requests, there's an option in the settings. Json where you can add in your own certain things with like the same search syntax and filter them just like you want. You can also create your own. There's little plus icon next to issues.

And when you do that, that's gonna open a markdown file. That markdown file is gonna have some templating stuff in it. But all you have to do is plug in a title. If you wanna assign it to someone, use an at sign and it brings in this great IntelliSense to let you add it to specific users, add labels to it. And one of the nice things about the labels is that if that label doesn't exist in your repo, it'll prompt you when you try to save and say, Hey, I don't know what that label is.

Do you want me to go ahead and create it when I create the issue? And you can choose yes or no there. It's fantastic. And that'll save the issue to GitHub.

It'll close the markdown and you'll be ready to work. One of the things I really like is the experience of working on an issue.

Working issue branches

5:04

When you look at the issues in that list, there's a little arrow there. When you press that arrow, it'll assign that issue to you. Then it'll also create a branch with the issue number, just locally. It doesn't push it to your remote places, but you can then start working. And when you're done that you'll notice that arrow button has changed into a stop button.

Press that stop and it will check out the main branch again and leave the issue branch still there for you to come back to later or do a pull request. Now let's talk about probably my favorite two features of this. I mean, GitHub, the pull requests and the issues are great. They really saved me a lot of time, but these two features are so stinking fantastic.

Mentions and code tasks

5:48

In any comment in your code, you can use the at sign to have IntelliSense with users that have committed and are contributors to your repository. So if you use at and then someone's name, it not only adds their name to your repo, your comment, but mousing over that now shows some more detail about that user, including their commit history on the repo. And then secondly, the ability to turn any to do comment into an issue. If you're like me, you use to do comments a lot. In JavaScript, I'm slash slashing to do whatever I want.

In this case, when you do that, if you look to the left of your comment, there'll be a little light bulb icon. You can click on that icon and say, create GitHub issue. It's so fantastic because it not only creates the issue for you, but it also adds the issues number to that comment. And then later on, when you go into that tree view with all your issues, there's a new context option that allows you to go to that spot in the code that's associated with that issue.

Jumping to issue code

6:46

So when you come back later and don't remember where you are, or perhaps you're working on an issue that you didn't create, you can right click and go straight to the spot in the code that that issue is focused on and get started right away. So you use this extension already. If you do, I'm really curious if anybody has any custom queries for port requests or issues. I wear it out all the time. If you enjoyed this video, be sure to hit the like button.

And if you wanna see more Versus Code extension highlight videos, be sure to subscribe to the channel and hit that bell to know when we release a new video. Until next time.

Sign in to join in. Reading needs nothing.