How to use an API
Noah Olatoye

Noah Olatoye

275

How to use an API

1. API Overview

Whenever you think of how easy it is to use digital devices like Mobile phones, web browsers or ATMs (Automated Teller Machines) to carry out the seamless task without having to connect cables or with the help of human interference, such devices are probably using API (Application Programming Interface).

For API to work effectively, it needs to perform a request and return a response. Think of API as a postman who takes your letter to the specified address and returns with a signed acknowledgment copy (in this case, referred to as a "response").

In simple terms, API is that middleman that helps both the client and the server communicate.

2. Steps to call an API

To call an API, here are four steps you need to follow.

  • Find an API (also called "endpoint")
  • After you find a valid endpoint, make a request
  • Handle response from the request
  • Handle errors if something goes wrong.

To get a practical sense of making API calls, we will make a request with JavaScript.

2.1. Find an API

Many platforms allow you to make API calls, but let's use RapidAPI Hub. The platform houses over 35k plus APIs. For practice, we will use the quote API endpoint from the platform.

2.2. Request an API

We need a request carrier; we will use JavaScript fetch method to reach the API endpoint.

fetch(‘API_URL’, { 
	// Additional config
})
	.then(response => response.json())
	.then(response => console.log(response))
	.catch(err => console.error(err));

The API_URL is the endpoint URL (the address you send your postman). The additional config helps us add more information about our intention (whether to store (POST) value in the database or GET some data). In this case, we will use the GET method. You can find the header config on RapidAPI Hub.

const options = {
	method: 'GET',
	headers: {
		'X-RapidAPI-Key': 'SIGN-UP-FOR-KEY',
		'X-RapidAPI-Host': 'famous-quotes4.p.rapidapi.com'
	}
};

fetch('https://famous-quotes4.p.rapidapi.com/random?category=all&count=1', options)
	.then(response => response.json())
	.then(response => console.log(response))
	.catch(err => console.error(err));

When you run the javascript file either in your console or browser, you will see the following output:

[
 {
  author: 'John Cusack',
  category: 'business',
  id: 7856,
  text: "Death is a billion-dollar business. They can't even pass a law where it takes seven days to get a gun. Why don't you have to go through the same kind of screening you do to get a driver's license? It's totally insane."
 }
]

3. Handling API Responses

When a postman is bringing feedback from the delivered dispatch, he comes along with so much information:

  • How long it took to get there
  • How minutes he has to call the receiver
  • How many litters of fuel were consumed
  • A signed acknowledgment copy etc.

The response works similarly; it is important we get just the signed acknowledgment copy. And we get that from the .json

.then(response => response.json())

Then the following line prints the response.

.then(response => console.log(response))

3.1. Handling API Error

It is crucial to handle the error in case things go wrong. You need to know what the error is and act accordingly. We use the catch method in this scenario.

.catch(err => console.error(err));

A tech career with instinctHub

Ready to kickstart your tech career or enhance your existing knowledge? Contact us today for a dedicated instructor experience that will accelerate your learning and empower you to excel in the world of technology.

Our expert instructors are here to guide you every step of the way and help you achieve your goals. Don't miss out on this opportunity to unlock your full potential. Get in touch with us now and embark on an exciting journey towards a successful tech career.

Add Comments

First Name
Last Name
Say something:

Are you human? Solve this:

+ = ?

Post you may also like