Recently, I got to learn how to fetch data from external APIs and use CRUD to display and manipulate the data on my web application.
HTTP Verbs - CRUD
There are HTTP verbs that you use to know what kind of requests to make using fetch
| VERB | ACTION/ REQUEST | DESCRIPTION |
| CREATE | POST | Create a new resource using data in the body of the request. |
| READ | GET | Retrieves a represantation of a resource. |
| UPDATE | PUT/PATCH | Updating part of an existing resource using data in the body of the request. |
| DELETE | DELETE | Deletes a specific resource. |
How to make requests using HTTP Verbs
We use the fetch() function to make requests.
GET Requests
The following is an example of how to make a GET request using fetch
Simple, right? Just fire off a GET request to your endpoint, and voila! You've got your data ready to use.
POST Requests
First up, let's talk about creating data on the server. This is where the magic of the POST request comes into play. With Fetch, it's super easy.
Just substitute the URL with your server endpoint and adjust the body to align with your data schema. Voila! You have successfully created data like a professional.
PATCH/ PUT Requests
Now, what if you need to update some existing data? That's where PUT or PATCH requests come into play, depending on whether you're replacing the entire resource or just modifying parts of it. Let's see it in action:
Just specify the ID of the resource you want to update, set the method to PUT or PATCH, and send your updated data in the body.
DELETE Request
Last but not least, let's talk about deleting data. When you want to remove a resource from the server, the DELETE request is your go-to move:
Just like updating, specify the ID of the resource you want to delete, set the method to DELETE, and you're done. Say goodbye to that data!
And there you have it! With Fetch in your toolkit, you're now a CRUD master. Go forth and build amazing things! Happy coding! 🚀👩🏾💻