Testing APIs with REST Client in VS Code

How about sending HTTP requests? Do you know how to say the word? Hello, world. My name is Michael Jolley and I'm the bald bearded builder. Let's talk about Versus Code extensions.

I can't count the number of times I've been working on an API, whether I'm building it or I'm using a third party one. And what I'm seeing just doesn't make sense, like the data I'm expecting isn't what I'm getting, so I have to open up some tool like Postman or Insomnia so that I can hit that endpoint just outside of my code to see the data that comes back. And that's where today's extension comes in. REST Client is one of the most useful tools for web development I have found in a long time. It's one of those, you can live without it, but if you start using it and like integrate it into part of your workflow, you're not gonna know how to live without it.

It's just amazing the productivity it'll bring you. Put simply, it allows you to make API calls from within Versus Code. Even though the name is REST Client, it doesn't mean you can only hit REST APIs with it, you can actually hit any HTTP API including GraphQL endpoints. Before we get into the details of the REST client extension, I just want to remind you, if you enjoy learning about new tools, hanging out with other developers and improving your productivity, then you should join us on our Twitch stream. We're there live every Tuesday, Wednesday and Thursday at two p.

M. Eastern. You can find us at twitch. Tvbaldbeardedbuilder. Okay, so back to the REST client.

You can get it from the link in the description, but normally you just click on the extension icon in Versus Code and search for REST Client and click the install button. Okay, now that it's installed, let's go over what it can do.

Let's try sending HTTP requests. Open a new document. Now you don't have to save this file, but if you do save it with a .http or .rest extension, you'll gain some IntelliSense that'll be really nice in the IDE. In our document, let's type the word get and then a space and then a URL. With IntelliSense, you can click the send request link in the IDE, but if you didn't save the file, you can use the command palette to send the request or you can use control alt R or command alt R.

One nice thing is that you can save multiple requests in the same file if you just separate them with an empty line, three hashes, empty line, new request. As you might expect to send a post request, you just replace the word get with post, but normally you're gonna wanna send a body with that. So just hit a couple new lines, leave one empty line between the request and headers and where your body's gonna be, and then you can type in your body there, JSON payload, XML, whatever you want. Speaking of headers, you can add any headers you need just under the URL. So for instance, if I needed to send a content type of applicationjson, I could just hit new line, type content type colon applicationjson and I'm ready to go.

I use this a lot when I'm sending authorization requests with bearer tokens. GraphQL is becoming really popular with companies like Facebook and GitHub and others just making these amazing APIs that we can use. I love GraphQL And calls to GraphQL queries are nearly identical to RESTful queries in this extension. You just need to change the body of the payload to be your GraphQL query or mutation, and then add the X request type parameter to the headers and put GraphQL as its value. Now, if you're eagle eyed, you noticed in that last example that something was weird in the header.

I had an authorization tag and I used a variable with it. That's right, you can use variables and save them in your file so that you can use them later on in multiple different requests. Let's convert that GraphQL query to use variables for the repository name and owner. First, on the top of the file, we'll set up our variables, set their values, and then down below in the variable section of our GraphQL, we'll update those to reference the variables we used above. Isn't that sweet?

I use this a ton, especially for like bearer tokens where I can set it at the top of the file and then use it for multiple calls below. Things like this where I have like one owner, but maybe multiple repository names below. There's so many use cases for this.

I'm not gonna go into all the details about the security options for this extension, but there are a ton of them. It handles basic auth, digest auth, Azure active directory, Microsoft identity, AWS signature version four. There are methods for all of these things and you can use them all with it. You can find more in the documentation of the extension, but it's just too much to cover here. There are so many customizations and other features to this extension.

It's too much for a five minute video. But I can tell you a few highlights, one particular, how about being able to copy in a curl request and it generates the JavaScript code or Python code for you to make that same request. Or if you create one of these requests like we've already done, you can export that as a crawl request to use in your code samples. Just mind blowing stuff, really cool. Now the question of the day for me is do you have an extension that you can't live without?

I love, love finding like neat little tools and tricks to improve my productivity. Listen, if you've seen me work, you know I need those enhancements. So listen, if you have one you like, leave it in the comments below. I read every one of them and I wanna try them all out. Especially if you think we should do a feature on it on the channel.

If you wanna hear more about extensions or tips or tools or code examples and just hang out, listen, hit that subscribe button below to know when we're gonna put out a new video. And if you enjoyed this video, hit the like button, It makes my day to see that. I really appreciate you hanging out. Until next time.