Add Pagination
Add Pagination in Rest API
▶️ What is pagination
- Page
- Page Number
- Limit
- So basically pagination is a way to limit the number of results that are returned from the API. This is useful when you have a large number of results and you don't want to return all of them at once. You can also use pagination to return results in chunks, which is useful if you want to display results in a list or table.
- For example, when you search for something on Google, you'll see a list of results. If you scroll to the bottom of the page, you'll see a link that says "Next". Clicking on that link will take you to the next page of results. This is pagination in action.
▶️ Problem
Suppose I do http://localhost:5000/api/tasks?page=4
I can't see the 4th page of the results.
▶️ Solution
- Create a variable
page
andlimit
and assign it toreq.query.page
andreq.query.limit
respectively.
controllers/task.js
let page = Number(req.query.page) || 1;
let limit = Number(req.query.limit) || 3;
- Add a formula to calculate the
skip
andtotalPages
and assign it toskip
andtotalPages
respectively.
controllers/task.js
let skip = (page - 1) * limit;
Let's understand the formula.
- Let's say user say page = 2 & limit = 3
- So skip = (2 - 1) * 3 = 3
- This mean data will show three data but skip first three data and show next three data from 4th data.
- Add a formula to calculate the
totalPages
and assign it tototalPages
respectively.
apiData we created in the previous chapter.
controllers/task.js
apiData = apiData.skip(skip).limit(limit);
You can test the skip function also by adding
skip
let's test this on testing server.
- And now pass
nbHits:myData.length
controllers/task.js
res.status(200).json({ myData , nbHits: myData.length});
nbHits
is the total number of results that match the query. This is useful if you want to display the total number of results on the page.
- Let's test this on production server.
controllers/task.js <- entire code
const Task = require("../models/Task");
const getAllTasks = async (req, res) => {
const { priority, status, description, sort, select } = req.query;
const queryObject = {};
if (priority) {
queryObject.priority = { $regex: priority, $options: "i" };
}
if (status) {
queryObject.status = { $regex: status, $options: "i" };
}
if (description) {
queryObject.description = { $regex: description, $options: "i" };
}
let apiData = Task.find(queryObject);
if (sort) {
let sortProblem = sort.replace(",", " ");
apiData = apiData.sort(sortProblem);
}
if (select) {
let selectProblem = select.split(",").join(" ");
apiData = apiData.select(selectProblem);
}
let page = Number(req.query.page) || 1;
let limit = Number(req.query.limit) || 3;
//formula for skipping
let skip = (page - 1) * limit;
apiData = apiData.skip(skip).limit(limit);
console.log(queryObject);
const myData = await apiData;
res.status(200).json({ myData , nbHits: myData.length});
};
const getAllTasksTesting = async (req, res) => {
const myData = await Task.find(req.query).skip(2);
res.status(200).json({ myData });
};
module.exports = {
getAllTasks,
getAllTasksTesting,
};