HTTP Methods for RESTful APIs

GET, POST, PUT, HEAD and DELETE ✨

What are HTTP methods ?

HTTP methods, also known as HTTP verbs, are the actions that can be performed on a resource on a server. The most common HTTP methods are GET, POST, PUT, PATCH, and DELETE, but there are many others, such as HEAD, OPTIONS, and TRACE. Each HTTP method has a specific purpose, and they are used to enable communication and data transfer between clients and servers.

And RESTful APIs ?

RESTful APIs are APIs that are designed to conform to the principles of the REST (Representational State Transfer) architecture. RESTful APIs use the HTTP methods to enable communication and data transfer between clients and servers, and they are based on the principles of statelessness, uniform interface, and resource-oriented design. RESTful APIs are typically used to expose data and services over the web, and they are widely used in web development.

The HTTP Verbs

The GET method

The GET method is used to retrieve a resource from the server. For example, when a web browser sends a GET request to a server to request a web page, it is using the GET method.

useEffect(() => {
    // Make an HTTP GET request to the server
    fetch('https://example.com/data.json')
      .then(response => response.json()) // parse the response as JSON
      .then(json => setData(json)) // set the data state to the JSON data
      .catch(error => console.error(error)); // log any errors
  }, []);

In this example, the component uses the fetch function to make an HTTP GET request to the server to retrieve a JSON file at the specified URL. The response is parsed as JSON, and the data is stored in the component's data state.

The POST method

The POST method is used to submit data to the server. For example, when you fill out a form on a website and click the submit button, your web browser sends a POST request to the server with the data that you entered in the form.

// Make an HTTP POST request to the server with the form data
    fetch('https://example.com/submit', {
      method: 'POST',
      headers: {
        'Content-Type': 'application/json'
      },
      body: JSON.stringify({
        name,
        email
      })
    })
      .then(response => response.json()) // parse the response as JSON
      .then(json => {
        // Do something with the response data here
      })
      .catch(error => console.error(error)); // log any errors
  };

In this example, the requests library is used to make an HTTP GET request to the server to retrieve a JSON file at the specified URL. The response is checked for success, and if it is successful, the response is parsed as JSON and the data is used in the code. If there are any errors, they are handled in the code.

The PUT method

The PUT method is used to update a resource on the server. For example, if you have permission to edit a file on a server, you could use the PUT method to send an updated version of the file to the server, and the server would replace the existing file with the updated version.

// Make an HTTP PUT request to the server with the updated data
    fetch('https://example.com/users/1', {
      method: 'PUT',
      headers: {
        'Content-Type': 'application/json'
      },
      body: JSON.stringify({
        name,
        email
      })
    })
      .then(response => response.json()) // parse the response as JSON
      .then(json => {
        // Do something with the response data here
      })
      .catch(error => console.error(error)); // log any errors
  };

Difference between PUT and POST

The main difference between the PUT and POST methods is the way they are intended to be used. The PUT method is used to update an existing resource on a server, while the POST method is used to create a new resource on a server.

Here are some other differences between the two methods:

• The PUT method typically sends the updated data to the server in the request body, while the POST method typically sends the new data to the server in the request body.
• The PUT method is idempotent, which means that multiple requests with the same data have the same effect as a single request. In contrast, the POST method is not idempotent, which means that multiple requests with the same data can have different effects.

The DELETE method

The DELETE method is used to delete a resource on the server. For example, if you have permission to delete a file on a server, you could use the DELETE method to send a request to the server to delete the file.

// Make an HTTP DELETE request to the server to delete the resource
    fetch('https://example.com/users/1', {
      method: 'DELETE'
    })
      .then(response => response.json()) // parse the response as JSON
      .then(json => {
        // Do something with the response data here
      })
      .catch(error => console.error(error)); // log any errors
  };

The HEAD method

The HEADER method is used to retrieve the headers for a resource on a server. It is similar to the GET method, but it only retrieves the headers for the resource, and not the resource itself. This can be useful in a number of situations, including:

• To check the status of a resource, such as whether it exists or has been modified, without retrieving the resource itself. This can be useful for optimizing performance and reducing network traffic.
• To retrieve information about a resource, such as its content type, size, and encoding, without retrieving the resource itself. This can be useful for determining how to handle the resource, or for displaying information about the resource to the user.

// Make an HTTP HEADER request to the server
    fetch('https://example.com/users', {
      method: 'HEADER'
    })
      .then(response => response.headers) // get the headers from the response
      .then(headers => {
        // Do something with the headers here
      })
      .catch(error => console.error(error)); // log any errors
  };

To conclude

HTTP methods are the actions that can be performed on a resource on a server, and RESTful APIs are APIs that are designed to conform to the principles of the REST architecture. They are essential for enabling communication and data transfer between clients and servers, and they are widely used in web development.