How do you do api pagination?

its not related to this:

How do i paginate data that i fetch from an API

My question is that if there is more than a single page of results whats the best way to go about it?
the data prop on the data object returned from the server from the first request will contain a total pages prop.

What I think i should do is if this is greater than one I need some variable to keep track of the current page and I need some while loop or recursive call to continue making api requests with an increasing variable (i.e. total pages) until im on some page equal to the total pages (base case or loop termination be that total pages=== currentPage or something like that…)

https://jsonmock.hackerrank.com/api/articles?author=<username>&page=<page>

Heres the challenge description:

the function will accept username and limit values, 
return an array of names of articles authored by the user with the given username, 
ordered by the number of comments they have, descending. Limit the list to limit records. 
If multiple articles have the same number of comments, order ascending by name.
If both the title and the story title of an article are null, then ignore the article.
Otherwise:
    If the title is not null, the name of the article is title.
    If the title is null, the name of the article is story_title.

my code so far:

const axios = require("axios");
async function topArticles(username, limit) {
  return await axios
    .get(`https://jsonmock.hackerrank.com/api/articles?author=${username}`)
    .then(({ data: { data } }) => {
      let titlesArray;
      data.sort((a, b) => (a.num_comments < b.num_comments ? 1 : -1));
      titlesArray = data
        .map((x) => (x.title ? x.title : x.story_title))
        .slice(0, limit);
      return titlesArray;
    });
}

async function main() {
  const result = await topArticles("epaga", 2);
  console.log(result.join("\n") + "\n");
}
main();

All help and advice appreciated. I realize I didnt take care of the sentence

If multiple articles have the same number of comments, order ascending by name.

But I figured Id do that later after I learned how to do api pagination

Some contradiction in your question? Pagination is one way to view more contents than fits on one page.

My personal preference is “infinite scrolling”. This link may or may not give you some clues: JavaScript Grid: Row Models?

negative. I dont believe it will help me pass the test case im failing:

testcase 10: Wrong Answer

Input [Download]

coloneltcb
2

Your Output

Silicon Valley Women, in Cultural Shift, Frankly Describe Sexual Harassment
No Thank You, Mr. Pecker

Expected Output [Download]

How Uber Used Secret “Greyball” Tool to Deceive Authorities Worldwide
No Thank You, Mr. Pecker

if there is only one page reutrned everything workds fine but if the data you need is on more than one page you will have to perfoerm s second api call ad increasing your current pagevariable and passing that as a parameter to the link each time building up the array with your returned results, and they you stop making calls when your base case hits that your current page exuals your totlal pages after that point you can start doing all your array manipulations accoring to how it wants it.

I mean its a cool library. but where exactly does it show how to do pagination like i want?

Maybe Im not describing it clearly. The server itself is returning releavant data that is somewhat paginated.

Im not asking how to do pagination on the front end with a large amount of data returned from a single request response cycle… at least I didnt see an option to recieve it that way.

like a request to:
https://someUrl.com/api/articles?author=${username}
the server will automatically send the first page if the parameter doesnt exist. if you did https://someUrl.com/api/articles?author=${username}&page={pageNumber} it will send you the results on that page number.

theres a total pages prop that you can use to determine the amount of requests youd have to make to get everything

If the server already has paginated it, then there must be a way to fetch next page using a “next” button.

Negative. It is an online coding challenge. You dont get to implement a UI. you have to get all the relevant data from the server in advance.

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.