Load More for BlogPage
Unanswered
Chilean jack mackerel posted this in #help-forum
Chilean jack mackerelOP
I’m currently working with Leerob’s blog repository, and I’ve hit a bit of a roadblock.
I’m trying to implement a ‘Load More’ button in the blog section to allow users to dynamically load additional posts.
I’m trying to implement a ‘Load More’ button in the blog section to allow users to dynamically load additional posts.
19 Replies
@Chilean jack mackerel
Chilean jack mackerelOP
@Arinji Yess
To make a load more type thing, do this.
Make a client component, in it have a state variable with all your posts
Make a client component, in it have a state variable with all your posts
send like the first 50ish post from a server component as props to the client component
makes sense till here?
Chilean jack mackerelOP
Yes understanding.. i searched whole github but I didn’t found any blog that use this.. at beginner level
Got it you point bro
np, its not that hard
so after that, in the client component
make a useEffect which calls a server action
make the server action return a bunch of posts in an array
make the useEffect have a loading state as its deps, and to return if loading is already true
and after the server action finishes, put the data it returned in the state array
lemme show code
Chilean jack mackerelOP
Bro can you help me in it.. i am using this: (https://github.com/januarfonti/fonti.dev) can you make a fork of it that uses this things i am not to server actions..
I try to contact with this reporter creator but he is busy somewhere.. you are helpful
note, my implementation is how instagram does it, so it dosent have a button to load more
@Chilean jack mackerel I try to contact with this reporter creator but he is busy somewhere.. you are helpful
go through the code and lemme know if you have questions