Best practice to consume apis in Next Js.
Unanswered
Philippine Crocodile posted this in #help-forum
Philippine CrocodileOP
I like to know what is the best way to consume apis are a Next js frontend.
Say I'm using apis from Rapid API.
Is it like creating custom hooks with usestate and useEffect. Or is there a better way?
Say I'm using apis from Rapid API.
Is it like creating custom hooks with usestate and useEffect. Or is there a better way?
5 Replies
@Philippine Crocodile I like to know what is the best way to consume apis are a Next js frontend.
Say I'm using apis from Rapid API.
Is it like creating custom hooks with usestate and useEffect. Or is there a better way?
server-side data fetching: use server components
client-side data fetching: use swr/react-query
client-side data fetching: use swr/react-query
@joulev server-side data fetching: use server components
client-side data fetching: use swr/react-query
Carea Castellano Manchego
@joulev which one is better, say i want to call an api, and change the calls (endpoints) on user interaction, are client components the only option in this case?
Difficult to generalize completely.
I would suggest to separate
1. consumption of endpoint (or rather their rendered output) and
2. selection of endpoints.
The selection can live in a client component which then ultimately selects different server components rendering the API output.
I would suggest to separate
1. consumption of endpoint (or rather their rendered output) and
2. selection of endpoints.
The selection can live in a client component which then ultimately selects different server components rendering the API output.
Client components surely aren't the only option. I personally fetch APIs server-side using Server Components. They can then still always hydrate client components down the tree.
Carea Castellano Manchego
the idea is user interaction would trigger other calls to filter for example. i don't see how can i separate consumption from selection here