Test APIs with ease, right inside VSCode

July 10, 2020 (4y ago)

Listen to this article

When working with APIs, you can either test them with Postman or cURL and they are the right tools for this workflow but what if I say, there is an extension which allows you to test APIs, without leaving the comfort of VSCode, that would be pretty handy. In this article, I'll introduce you to that extension & guide you on how work with it.

The Extension

The extension is called REST Client developed by Huachao Mao along with many contributors.

REST Client extension for Visual Studio Code

Installation

The extension can be downloaded using the command palette.

ext install humao.rest-client

You can also find it on Visual Studio Marketplace.

Working

Installing the extension brings in support for two file types - .http & .rest. Creating a file with one of those extension will enable you to perform requests.

The JSON Placeholder API is a good place to start. In a new workspace, create a file with either .http or .rest as the extension. For this example, I'd be using jsonPlaceholder.rest, this is where all the API requests will be made throughout this article.

New Workspace

Performing a GET Request

Let's perform a GET request to the /posts endpoint.

GET Request to Posts Endpoint

First line is what initiates the actual request followed by the Content-Type of the response. Usually, when you're dealing with REST APIs, it is set to application/json.

Those two lines is all that you need to perform a GET request. There will be small text right above the first line with a text of Send Request, click it to initiate the request.

As you initiate the request, a new pane to the right should open along with the response provided by the API. It's that simple.

Response from the API when GET request is performed.

Performing a POST Request

While performing a POST request, you generally have to send the data to be posted via the request's body. You can attach the data to the request's body as shown below:

POST request to posts endpoint.

On initiating the request, API should respond with the data posted.

Response from the API when POST request is performed.

You can perform any number of requests from a single file. To seperate multiple requests, just add ### in between them.

Making Requests to a GraphQL API

Requests to an GraphQL can be made as well. For this example, we'll be using the GitHub API.

Making request to a GraphQL.

That's it for this article. As I explore more of this extension, I'll keep updating with more actions you can perform with this extension.