[Web] Testing Rest API on VS Code

Sometimes we want to simply test the backend that we have made.

Also, these days the editor that is the most used is definitely VS Code.

So in this posting, I will show you the simple Rest API test method on VS Code.

Installation

All we need is just REST Client extensions.

Find humao.rest-client in the extensions marketplace, and install it.

Back-End

And, I don't have a backend right now, so I'll use site jsonplacehoder as a backend.

https://jsonplaceholder.typicode.com/

VS Code

Let's make a file for the test. I named it test.http.

Any name is fine if the extension ends with .http or .rest.

Rest API Test (CRUD)

The preparation is all done. It's time to test.

Create

Create is tested by the POST method of an HTTP request.

Add the below code in our test file.

POST https://jsonplaceholder.typicode.com/posts HTTP/1.1
content-type: application/json

{
    "title": "test post",
    "body": "This is a test post."
}

It means we create the POST method of an HTTP request with data of JSON type.

It will look like the below.

Can you see Send Request in the red box?

If you click it, the HTTP request will be sent, and you will see the message from the backend server.

The right side pane in the VS Code is the message from the backend server.

Read

Read is tested by the GET method of an HTTP request.

Let's add the below code as well.

###
GET https://jsonplaceholder.typicode.com/posts/1 HTTP/1.1

###
GET https://jsonplaceholder.typicode.com/comments?postId=1 HTTP/1.1

### is the separator between test codes, and it is mandatory.

The GET method of an HTTP request is so simple.

We can also test an HTTP request with queries.

Update

Update is tested by the PUT or PATCH method.

The PUT method is usually used when you want to update all the contents.

The PATCH method is usually used when you want to update partial contents.

Now, add the below code in the test file.

###
PUT https://jsonplaceholder.typicode.com/posts/1 HTTP/1.1
content-type: application/json

{
    "title": "test post",
    "body": "This is a test post."
}

#{
#  "title": "test post",
#  "body": "This is a test post.",
#  "id": 1
#}

As you can see, if you use the PUT method, the whole contents are updated.

###
PATCH https://jsonplaceholder.typicode.com/posts/1 HTTP/1.1
content-type: application/json

{
    "body": "This is an updated content"
}

#{
#  "userId": 1,
#  "id": 1,
#  "title": "sunt aut facere repellat provident occaecati excepturi optio reprehenderit",
#  "body": "This is an updated content"
#}

On the contrary, if you use the PATCH method, only specified contents are updated.

Delete

Delete is tested by the DELETE method.

Add the below code.

###
DELETE https://jsonplaceholder.typicode.com/posts/1 HTTP/1.1

This method is as simple as the GET method.

 

See how easy it is?

Now, you can easily test your backend server on the VS Code.