Using the Reqres.in Public API with JavaScript


Reqres.in is a great resource that provides a public API that you can use to build and test your applications. In this article, we'll show you how to use the Reqres.in API with JavaScript and provide some example code to get you started.

Getting Started

First, let's take a quick look at the available endpoints of the Reqres.in API.

  • GET /api/users

    Returns a list of users.

  • GET /api/users/{id}

    Returns a single user.

  • POST /api/users

    Creates a new user.

  • PUT /api/users/{id}

    Updates an existing user.

  • DELETE /api/users/{id}

    Deletes an existing user.

Example Code

We'll start by using the fetch method to make our API calls. This method allows us to make network requests and handle the returned data. Here's some example code to get you started:

// Get list of users
fetch("https://reqres.in/api/users")
  .then(response => response.json())
  .then(data => console.log(data));

// Get a single user
fetch("https://reqres.in/api/users/2")
  .then(response => response.json())
  .then(data => console.log(data));

// Create a new user
fetch("https://reqres.in/api/users", {
  method: "POST",
  headers: {
    "Content-Type": "application/json"
  },
  body: JSON.stringify({
    name: "John Doe",
    job: "Developer"
  })
})
  .then(response => response.json())
  .then(data => console.log(data));

// Update an existing user
fetch("https://reqres.in/api/users/2", {
  method: "PUT",
  headers: {
    "Content-Type": "application/json"
  },
  body: JSON.stringify({
    name: "Jane Doe",
    job: "Designer"
  })
})
  .then(response => response.json())
  .then(data => console.log(data));

// Delete an existing user
fetch("https://reqres.in/api/users/2", {
  method: "DELETE"
})
  .then(response => console.log(response));

Conclusion

Using the Reqres.in public API with JavaScript is a great way to get started with building and testing your applications. With the available endpoints and some example code, you'll be up and running in no time. Happy coding!

Related APIs in Development