Next.js Discord

Discord Forum

useEffect() only fetching data at build time

Answered
Philippine Crocodile posted this in #help-forum
Open in Discord
Philippine CrocodileOP
Hi all,

Very new to NextJS, am struggling though.

I have a component (marked as "use client") which uses useEffect() in order to fetch data from "/api/getActivity":

const response = await fetch("/api/getActivity");

This goes to the code I have written in api/activity/route.ts.
During development this works fine, and gets me fresh data each time.
But when doing npm run build, I see this: "GET /api/getActivity"
Later, the npm run build shows this: â—‹ (Static) prerendered as static content
So, it is calling the endpoint, and saving it - I guess for SSG?

I thought that by using useEffect, it would be CSR?

Not sure where my understanding is failing, but any pointing in the right direction would be greatly appreciated 🙂
Answered by Peterbald
You pass in { cache: 'no-store' }
View full answer

14 Replies

Peterbald
Next.js version?
If you are running 14.x it'll fetch the data and cache it
only in 15.x it'll not cache the fetch value.
@Philippine Crocodile
Philippine CrocodileOP
@Peterbald Thank you!
According to my package.json, I'm on version: 14.2.14.
Do you happen to know where this change is documented?
I'm worried that if I change my nextjs version to 15, other stuff will break.
Is there a way in v14.x.x to not cache the data?
Peterbald
Yes, there's a flag that you have to pass.
Also, if you do upgrade to next.js 15.
you can run codemod upgrade, which will handle almost entirety of your code to be upgraded from 14.x to 15.x
for Next.js 14 ↑
Peterbald
You pass in { cache: 'no-store' }
Answer
Peterbald
or, you can upgrade Next.js 15.1 with codemod upgrade path: https://nextjs.org/blog/next-15-1
Philippine CrocodileOP
Thank you so much @Peterbald 🙂
Original message was deleted
Peterbald
No worries, just mark your answer.