What are the HTTP methods?

JavaScript HTML

HTTP Methods

The HTTP protocol implements a handful of "methods" we can use when making requests:

  • GET
  • POST
  • PUT
  • PATCH
  • DELETE

Whenever we make a network request, we specify which method it should use. You can think of it almost like part of the URL; a GET request to https://hello.com is a different “destination” than a POST request to https://hello.com.

These methods signal to the API that our request should be handled in a certain way. For the most part, these are about following conventions. But there are some technical differences between them.

API Terminology

In this lesson, I'll use the term “API” to refer to the backend server that receives and processes our network requests.

API stands for “Application Programming Interface”, and it refers to the interface we can use to communicate with a larger system.

For example, our backend server might make a handful of routes available, things like:

  • /api/contact
  • /api/search
  • /api/login

You can think of these routes like the doors on a large building. The building can only be accessed through these doors.

Similarly, the React “API” can be accessed through the methods it provides, things like:

  • React.useState
  • React.useEffect
  • ReactDOM.createRoot

It can be confusing, because the term “API” is often used very broadly, but it always refers to the exposed parts of a larger system.

Conventions

By convention, here's when we should use the following methods:

GET

This method is used when retrieving information from the API. For example, this request will retrieve a list of search results:

GET /api/search?query=cats

Traditionally, “GET” is the default method, and will be used if no method is specified.

POST

The POST method is often used when creating something new. For example, registering a new account, or submitting a contact form (creating an email message).

POST / api / register;

PUT / PATCH

The PUT method is used when modifying an existing thing. For example, resetting a password or editing a social media post.

PUT / api / message / a1b2c3;

The PATCH method is a slightly newer method, and it serves the same semantic purpose: modifying an existing thing. The difference is that we send less information with PATCH.

Suppose we're editing a user:

  • With PUT, we send a complete user object, with all of the properties. We're “putting” this new user in the database, replacing the old one.
  • With PATCH, we only send the properties that are changing. We're patching the existing user, like patching a pair of jeans.

We'll learn more about how to attach data to our requests later in the course.

DELETE

Unsurprisingly, DELETE is used when deleting an existing thing. For example, deleting a social media post.

DELETE / api / message / a1b2c3;

Technical differences

On their own, HTTP methods don't really “do” anything. It's up to the back-end developer to decide how to respond to a PUT request or a DELETE request. A chaotic-evil back-end developer could easily wire it up so that DELETE is used to create new entities, and POST deletes them.

The main reason these methods exist is to allow us to differentiate between different requests to the same route. For example, the /api/user route could be used to handle all CRUD operations:

  • GET: retrieve a specific user
  • POST: create a new user
  • PUT/PATCH: modify a specific user
  • DELETE: delete a specific user

That said, there is an important technical difference to be aware of: GET methods don't support body parameters.*

When making a POST/PUT/PATCH/DELETE request, we can specify additional data as the request “body”:

POST /api/user
body: {
email: 'hello@there.com',
name: 'coolperson1234'
}

If we think of network requests as letters sent in the mail, the body is the content of the letter itself, the thing being sent. This is sometimes referred to as the “payload”.

When we send a GET request, we can't include a body. GET requests are always empty envelopes.

The only way to send data along with a GET request is to include it in the URL, in the form of query parameters:

GET /api/user?email=hello@there.com&name=coolperson1234

As far as I know, this is the main technical difference between GET and all the other methods (POST/PUT/PATCH/DELETE).

To be clear, the back-end developers who build the API are responsible for picking the method(s) to use for every route. They configure the API, and we use it according to their specifications.

00:00