#Questions about where to put database queries, seeing different wants in tutorials

2 messages · Page 1 of 1 (latest)

fierce flower
#

New to Router/Start, coming from a Remix/RR7 background. There might not be a right or wrong answer, but I'm looking for the proper way, the intended way to do this. Here is a route loader from the docs.
// routes/posts.tsx export const Route = createFileRoute('/posts')({ loader: () => fetchPosts(), })
It has the data fetching happening in the exported route. Here is something from Convex (which I'm also new to).
`function Home() {
const { data } = useSuspenseQuery(convexQuery(api.tasks.get, {}));

return (...`
It has the data being fetched/queried in the component function and not in the exported loader. Coming from a Remix/RR7 mindset, doing that in the Loader and passing it to the component is the "right" way to do it (useLoaderData).
It looks like it works both ways (based on my copying and pasting and playing with data). Is the proper way to fetch the data in the loader? What does one gain/lose by doing it in the component?

viral river
#

IMO the best is to kick off the query in the loader using queryClient.ensureQueryData(postsOptions) and then useSuspenseQuery(postsOptions) in the loader