Get new data from DB with SSR/Client components
Unanswered
Masai Lion posted this in #help-forum
Masai LionOP
I'm so much confused by new APP and Server/Client components mechanism. I read docs and tried to find any possible solution, but I didn't find anything that actually works.
I'm building jobboard application, just for learning purposes. I've created Header, Footer, even Pagination component, and it is really nice how it can be build. However, I'm fetching data in my "MAIN" SSR component, which I pass then to my OffersComponent. So all works when I fetch all data at the beginning, but I don't want to fetch all data at once, I want to fetch lets say 50 offers from my DB and if it will be needed, I want to fetch more on request (button click).
I cannot retrieve data in Client components, getServerSideProps doesnt work also with App etc. So how I can tell my SSR component to get new data based on click from Client Component? I'm using router for my pagination so my address is changing, I wanted to somehow retrieve that url data on SSR component, but I failed.
What I am missing here?
I'm building jobboard application, just for learning purposes. I've created Header, Footer, even Pagination component, and it is really nice how it can be build. However, I'm fetching data in my "MAIN" SSR component, which I pass then to my OffersComponent. So all works when I fetch all data at the beginning, but I don't want to fetch all data at once, I want to fetch lets say 50 offers from my DB and if it will be needed, I want to fetch more on request (button click).
I cannot retrieve data in Client components, getServerSideProps doesnt work also with App etc. So how I can tell my SSR component to get new data based on click from Client Component? I'm using router for my pagination so my address is changing, I wanted to somehow retrieve that url data on SSR component, but I failed.
What I am missing here?
1 Reply
@Masai Lion I'm so much confused by new APP and Server/Client components mechanism. I read docs and tried to find any possible solution, but I didn't find anything that actually works.
I'm building jobboard application, just for learning purposes. I've created Header, Footer, even Pagination component, and it is really nice how it can be build. However, I'm fetching data in my "MAIN" SSR component, which I pass then to my OffersComponent. So all works when I fetch all data at the beginning, but I don't want to fetch all data at once, I want to fetch lets say 50 offers from my DB and if it will be needed, I want to fetch more on request (button click).
I cannot retrieve data in Client components, getServerSideProps doesnt work also with App etc. So how I can tell my SSR component to get new data based on click from Client Component? I'm using router for my pagination so my address is changing, I wanted to somehow retrieve that url data on SSR component, but I failed.
What I am missing here?
you can use router.replace() or redirect()
i forgot which but SSR components are only updated if you
1) refresh the page
2) hard navigate your page after ~30 seconds of navigation
so what I usually do is, you can set the onClick button to call a server component on which it will
i forgot which but SSR components are only updated if you
1) refresh the page
2) hard navigate your page after ~30 seconds of navigation
so what I usually do is, you can set the onClick button to call a server component on which it will
revalidatePath('/') (everything) which will rerender SSR and update the DOM to the latest data