How to fetch from backend in client component (for logo, not for sensitive info)
Answered
Spectacled bear posted this in #help-forum
Spectacled bearOP
Hello everyone,
I have a Logo component which combines an image and some text with some styling to use as the logo of the website.
This Logo component will be used in client components too, so I can't use async/await to fetch from the backend (to get the url of the image and the text).
Is there a way I can get around this, or maybe some more proper way to preload the data I need for the Logo component, without having to then pass props to every component from my layout to the Logo?
I have a Logo component which combines an image and some text with some styling to use as the logo of the website.
This Logo component will be used in client components too, so I can't use async/await to fetch from the backend (to get the url of the image and the text).
Is there a way I can get around this, or maybe some more proper way to preload the data I need for the Logo component, without having to then pass props to every component from my layout to the Logo?
Answered by B33fb0n3
you can fetch data clientside using a clientside fetching library like react query or swr. I prefer react query, because you can do a lot with it and it's easy to start. So start with it 🙂
7 Replies
@Spectacled bear Hello everyone,
I have a Logo component which combines an image and some text with some styling to use as the logo of the website.
This Logo component will be used in client components too, so I can't use async/await to fetch from the backend (to get the url of the image and the text).
Is there a way I can get around this, or maybe some more proper way to preload the data I need for the Logo component, without having to then pass props to every component from my layout to the Logo?
you can fetch data clientside using a clientside fetching library like react query or swr. I prefer react query, because you can do a lot with it and it's easy to start. So start with it 🙂
Answer
@B33fb0n3 you can fetch data clientside using a clientside fetching library like react query or swr. I prefer react query, because you can do a lot with it and it's easy to start. So start with it 🙂
Spectacled bearOP
I was looking into react Context, havent figured out how it works 100% yet, but do you think it's better to use react query instead of context?
Spectacled bearOP
oh ok, thanks!
I was assuming that context was going to be better because client-side fetching c an be dangerous, but im just fetching an image and some text so it makes sense in this case 😛
Thanks for the help! ^^
I was assuming that context was going to be better because client-side fetching c an be dangerous, but im just fetching an image and some text so it makes sense in this case 😛
Thanks for the help! ^^
Spectacled bearOP
yup, on it! I ended up using swr because I've already got some familiarity with it from a previous project, and it did the trick! Thanks man!