Call third-party API

Let's make another route and this time we will call a third party api - https://jsonplaceholder.typicode.com/todos, which will send us a list of 200 mock todos back to us and we will respond back the same.

In this second endpoint we will accept a query parameter and use it inside our route code.

Some things we will explore and solve

  1. Our code should wait till the third party api responds us with its data, once we receive it, we will then resume executing our own code. We will using the concept of async javascript to acheive this.
  2. We will accept a parameter called limit where will limit the no of objects we return in our code
  3. We will use axios, a popular third party library to make http requests.

First install axios dependancy with this command.

npm install --save axios

Let's write our second route code and dig into what it is doing

app.get('/tasks', async (req, res) => {
    let { limit } = req.query;
    try {
        const response = await axios.get('https://jsonplaceholder.typicode.com/todos');
        let todos = response.data;
        if (limit) todos = todos.slice(0, limit);
        res.send(todos);
    } catch (error) {
        res.status(400).send({
            status: 'Failed',
            details: error
        })
    }
});

Breakdown of above route

Second Route

The code seems similar to the previous route but you see some things in this.

-> The async part means that you are implying you compiler to expect some code that will pause the execution until told.

-> Remember when we said the express routes will be expecting two parameters usually, the first parameter will be always containing the request data. So here we are interested in the req.query data, which will be having all of our query parameters.

So, if we make the API call like this http://localhost:4000/tasks?limit=2

In this case we are capturing the query parameter called limit and saving it in a variable called limit.

-> We are using axios to make a third-party API request, a GET request to be specific, to this api - https://jsonplaceholder.typicode.com/todos.

Go ahead and open it in your browser and you will see it returns us 200 dummy todos in a array. The await keyword before axios.get means you want to wait till the api return us data.

-> We then check if we our api endpoint had a limit parameter, if it did we are slicing the array so that we respond back limited results as requested or just respond back all the results.

-> the status(400) means we are sending the api request along with a HTTP Status Code 400 which will learn more about further in this course.

So there we go, we learned how to use third-party APIs, capture query parameters, and use them in our code, we also made use of ES6 concepts like async/await. You can add this route in your project code and run it try.

In the meantime let's also host this on glitch.com so that we will be having a live API that we can call from anywhere.

Hosting on Glitch

Open up glitch.com and sign up and click on New project, since we are making apis with express, select hello-express option.

Next Chapter

APIs vs Webhooks