Fetching data inside a component

[frosty lance]

I'm not sure I understand the question, are you asking if its a bad practice to use useEffect to fetch data with Next.js? if so then no, that's perfectly fine if you don't want to use the data-fetching methods to fetch the data in the server and prerender the page with it

[green vigil]

Ok, but what would be the best way?

I mean I'm fetching data inside this component, the data it static, it will not change

So it might be better serverside rendering?

But I don't know if I can do that inside a component cause the code above gives me an error

[frosty lance]

it depends on the data, if it is static as you said then it would be better to fetch it in getStaticProps so you fetch it only once during the build and it won't be fetched again

[green vigil]

that's it

so I can use serverside rendering inside a component like the code above?

cause its now working

not*

[frosty lance]

the data-fetching methods only work in page components, the ones in the pages/ directory

you need to fetch the data in your page and send it through props to your components

[green vigil]

ok thanks

[opaque moth]

really? 😢
I mean, there's no way to fetch data inside a component? Meaning that I can't reuse that component in multiple pages in a easy way.?!