2022-03-11
4459
#react
Sampath Gajawada
96445
Mar 11, 2022 â‹… 15 min read

React pagination from scratch using hooks

Sampath Gajawada I'm a full-stack developer who always wishes to implement new and challenging elements in my daily life. Currently, my focus is on React and Vue.

Recent posts:

designing llm first products

Designing LLM-first products, not just features

Everyone’s building chat-first AI products. And most of them suck. Here’s how to break the mold and ship LLM-native software that actually solves problems.

Rosario De Chiara
May 30, 2025 â‹… 4 min read
Build A React AI Image Generator With Hugging Face Diffusers

Build a React AI image generator with Hugging Face Diffusers

Build a React-based AI image generator app offline using the Hugging Face Diffusers library and Stable Diffusion XL.

Andrew Baisden
May 29, 2025 â‹… 10 min read
Gemini 2.5 and the future of AI reasoning for frontend devs

Gemini 2.5 and the future of AI reasoning for frontend devs

Get up to speed on Google’s latest breakthrough with the Gemini 2.5 model and what it means for the future of frontend AI tools.

Chizaram Ken
May 29, 2025 â‹… 5 min read
Exploring The Top Rust Web Frameworks

Exploring the top Rust web frameworks

In this article, we’ll explore the best Rust frameworks for web development, including Actix Web, Rocket, Axum, warp, Leptos, Cot, and Loco.

Abiodun Solomon
May 28, 2025 â‹… 11 min read
View all posts

3 Replies to "React pagination from scratch using hooks"

  1. Hi, This is great article about pagination.
    What if, we wanted to show the button to show last page and first page

  2. Hi, Although the approach for creating pagination is great and easy. I’m bit concerned about what will happen if current page won’t load then we will end up showing current page on UI but with the old data.

    IMHO It would be great if we just set current page once page data is fetched. and in next and previous calls we just increment and decrement current page with a local variable.

  3. There is bug with the code on github
    fetch(`https://api.instantwebtools.net/v1/passenger?page=${currentPage}&size=5`) instead of
    fetch(`https://api.instantwebtools.net/v1/passenger?currentPage=${currentPage}&size=5`)
    in teh file Passenger.js

Leave a Reply