External APIs: Paging

Hey there! In this guide, we'll explore how to work with external APIs that have pagination or limits and offsets using Xano. Have you ever encountered an API that returns data in chunks, and you need to continuously call it to retrieve all the data? Well, you're in luck because Xano makes this task a breeze!

Understanding the PokeAPI Example

To illustrate this process, we'll be using the PokeAPI, a handy API that provides information about different Pokemon. If you visit PokeAPI.co, you'll see a "Try it out" section where you can fetch a list of Pokemon.

The API has parameters like `limit` and `offset` that control how many Pokemon are returned and where to start in the list, respectively. For example, setting `limit=100` and `offset=200` will return 100 Pokemon starting from the 201st entry.

Step 1: Create a Variable for the API Response

First, let's copy the API URL into Xano and run it. You'll notice that the response includes various details like the request headers, response headers, and the actual Pokemon data.

To work with the data more easily, create a new variable using the "Sub Path" feature. This allows you to drill down and select the specific data you want to work with.

1. Copy the API response as JSON.
2. Create a new variable called `results` using the "Sub Path" feature.
3. Navigate to the desired data path (e.g., `result.results`) and select it.

Step 2: Set Up Pagination Variables

Next, we'll create variables to control the pagination process. Since we want to fetch the last 118 Pokemon, we'll set the initial `offset` to 1000 and the `limit` to 2 (for demonstration purposes).

1. Create a new variable called `offset` and set its value to `1000`.
2. Create a new variable called `limit` and set its value to `2`.

Step 3: Update the API Call with Pagination Parameters

Now, we'll update the API call to include the `limit` and `offset` parameters using the variables we just created.

1. In the API call, locate the "Params" section.
2. Add a new parameter called `limit` with the value set to the `limit` variable.
3. Add another parameter called `offset` with the value set to the `offset` variable.

Step 4: Accumulate Data with a While Loop

To gather all the Pokemon data from the paginated API, we'll use a `while` loop. This loop will continue iterating until we've retrieved all the data.

1. Create a new `while` loop with the condition set to `true`.
2. Inside the loop, add a conditional statement that checks if `results.next` is equal to `null`. If it is, break out of the loop using `break`.
3. After the conditional statement, update the `offset` variable by adding the current `limit` value to it.
4. Create a new variable called `listOfNames` and initialize it as an empty array.
5. Inside the loop, update the `listOfNames` variable by merging it with the `results.results.name` values from the API response.

Step 5: Run and Customize

Now you're ready to run the script and see the accumulated list of Pokemon names! If you want to fetch a different range of Pokemon, adjust the initial `offset` value and the condition in the conditional statement.

For example, to fetch the first 25 Pokemon, set the initial `offset` to `0`, and change the conditional statement to break the loop when `offset` is greater than or equal to `25`.

And there you have it! You've successfully learned how to work with paginated APIs in Xano. This technique can be applied to various APIs, allowing you to gather data efficiently and seamlessly.

Feel free to experiment and adapt the code to suit your specific needs. Happy coding!