Skip to main content

Command Palette

Search for a command to run...

HTTP Methods

Published
3 min readView as Markdown

Understanding HTTP Methods in RESTful APIs: GET, POST, PUT, DELETE, and PATCH

RESTful APIs rely on HTTP methods to enable clients and servers to communicate. Each method has a unique purpose, enabling the creation, retrieval, update, or deletion of resources. Here’s a detailed guide to the most commonly used HTTP methods in RESTful APIs, including use cases and examples.

Understanding HTTP Methods in RESTful APIs: GET, POST, PUT, DELETE, and PATCH

RESTful APIs rely on HTTP methods to enable clients and servers to communicate. Each method has a unique purpose, enabling the creation, retrieval, update, or deletion of resources. Here’s a detailed guide to the most commonly used HTTP methods in RESTful APIs, including use cases and examples.

GET /api/products

This example retrieves a list of products from the /products endpoint.

In Angular:

this.httpClient.get('https://api.example.com/products')
  .subscribe(data => console.log(data));

2. POST: Creating a New Resource

POST sends data to the server to create a new resource. Unlike GET, POST is not idempotent; each request creates a new instance of a resource.

When to Use POST

  • Creating new resources, such as new users or blog posts.

  • Suitable for sending data that will be stored on the server.

Example:

POST /api/products
Content-Type: application/json

{
  "name": "New Product",
  "price": 19.99,
  "description": "A sample product description"
}

In Angular:

const newProduct = { name: 'New Product', price: 19.99 };
this.httpClient.post('https://api.example.com/products', newProduct)
  .subscribe(response => console.log(response));

3. PUT: Updating an Existing Resource

PUT updates an entire resource on the server. It’s often used when modifying an existing record. PUT requests are idempotent; sending the same request multiple times will have the same effect as sending it once.

When to Use PUT

  • Replacing an entire resource or updating all its fields.

  • Modifying data when the resource ID is known.

Example

PUT /api/products/1
Content-Type: application/json

{
  "name": "Updated Product",
  "price": 24.99,
  "description": "Updated product description"
}

In Angular:

const updatedProduct = { name: 'Updated Product', price: 24.99 };
this.httpClient.put('https://api.example.com/products/1', updatedProduct)
  .subscribe(response => console.log(response));

PUT vs. POST

  • POST creates a new resource, even if similar data exists, while PUT updates a specific existing resource.

  • POST can be used when adding data to a collection, whereas PUT is suitable for modifying a single item by its ID.

4. DELETE: Removing a Resource

The DELETE method removes a resource from the server. It’s idempotent; repeated DELETE requests produce the same effect as a single request.

When to Use DELETE

  • Removing resources, such as deleting a user account or an unwanted product.

  • For actions that should permanently remove data.

Example

DELETE /api/products/1

In Angular:

this.httpClient.delete('https://api.example.com/products/1')
  .subscribe(response => console.log('Deleted:', response));

5. PATCH: Partially Updating a Resource

PATCH is used for partial updates. It’s more efficient than PUT when only a few fields need to change. PATCH requests can also be idempotent, depending on the server implementation.

When to Use PATCH

  • Modifying only specific fields of a resource without altering the entire data structure.

  • Making lightweight updates to resources, such as changing a single user attribute.

Example

PATCH /api/products/1
Content-Type: application/json

{
  "price": 29.99
}

In Angular:

const updatedFields = { price: 29.99 };
this.httpClient.patch('https://api.example.com/products/1', updatedFields)
  .subscribe(response => console.log(response));

Conclusion

Understanding the purpose of each HTTP method is essential for designing RESTful APIs. By using these methods appropriately, you can build efficient, maintainable, and predictable web services. In Angular, leveraging HttpClient to make these requests simplifies handling data and allows easy integration with any backend.

Additional Resources:
https://developer.mozilla.org/en-US/docs/Web/HTTP/Methods

###