Next.js works quite well with this setup tbh. Using the middleware and the route.ts routes that it offers, a lot of code that should be handled server-side, is handled server side.

Mostly CSR, but all authentication stuff is handled server-side. Building dynamic dashboards is quite difficult using SSR.

This is nice! I like the fact that queries are defined in a separate queries directory

eg.

- /data/queries/user.ts

import { queryOptions } form '@tanstack/react-query'

export const getPosts = queryOptions({
queryKey: ['posts'],
queryFn: getPosts,
})

- /components/feed.tsx

import { getPosts } from '/data/queries/user.ts'

const { data: posts } = useQuery(getPosts)