Add Infinite Scrolling in React JS in Hindi 🔥

Welcome, we will how to add infinite scroll with react js? Infinite scroll is a mechanism that shows data based on an endless scroll event and loads data only as needed to avoid critical performance issues.

😊 Become Member, get access to perks, free Source code, & more..

--------------TIMEILINE-----------
0:00 Introduction
1:15 Code overview
4:30 Scroll Event
6:15 Logic of Infinite Scroll
11:20 let's write code of inifinite
12:25 update the page count
15:02 correct the error
16:25 add loading effect
18:15 Free Source Code

************* 😍 Must Watch Videos For Web Development 😍 *************

[ThapaTechnical]

😊 Become Member, get access to perks, free Source code, & more..

[neontuts]

Thanks for sharing. A simple tip - use throttling in the network tab of dev tools. To show the loading spinner :)

[shubhamnagota]

Nice concept.
You can go to network and change throttling to Slow 3G to see the loading bar.

[mohitashliya]

Bhai Bahut achaa bs ese hi banate raho bahut simple kr diya aapne infinite scroll ko.

[technical.legend]

Harry bhai ke sath apka collab video askta hai kya?

[musicworld]

finally someone teaches indepth thanks ...love you bro

[aashishmiglani]

Hello
Can we do apply this logic to any div, table or in select tag?

[kishankumarswain]

What's extensions and theme are you using in this project ??

[rakibul]

Love You Broo ❤❤❤❤❤❤❤❤ from Bangladesh

[pritamsingh]

thapa bro Caching handling pr video ek video bna do ... like when we call listing api then go next page and again we go prev page api called... so please make one tutoreal on this topic. thankyou bro.

[gshabeer]

03:40 Text limit can also be set by css

[Muhammadbilal-zwgz]

Nice video Vinod bhai but ek bus tracking app ka project bhi lao in reactjs with nextjs

[mdnazmulh.]

Can we do same thing with posts limit instead of page count?

[shabnam]

I have some navlinks with category name and I want to filter prouducts based on the value(category name) in navlink. My api looks like 'domain-name/ I did the same and add the categoryname in useeffect hook. But products are not showing. How to do that? @ThapaTechnical

[MythicalSaty]

Is this the scalable way of doing infinite scroll or there are other better ways i can explore!

[iankiii]

Sir, but if we spend data to same state, won't it re-render whole component with prev data as well ? What if we want to render only new Data and prev data list should not be re-render ?

[RavindraSingh-lppl]

@thapa React p series banaao yaar one major project k saath.

[humerasad]

Sir kia ap bta skty hai react kaha sy start kron ap k channel py multiple Playlist hai smj ni a rhi kaha sy start kron

[ashispyne]

after last record, if I scroll up and down, its again loading the function, will it be normal to load every time where we reached the last data?

[souravbishai]

sir one video for react top loading bar