NextJs & React Query SSR, SSG 적용 (내부 API 기능을 활용할때)

NextJs 에서 따로 custom server 를 두지 않고 내부 서버를 활용할때는
api 경로로 axios 로 받아서 처리가 되지 않는다.

이유는 나중에 build시, 문제가 되서인데,
그래서 getStaticProps 나 getServerSideProps 나
DB 에 직접 접근하는 코드를 써줘야해서인데 그러다 보니
React Query 까지 쓰면 상당히 괴랄해지는 코드가 나오는 것 같다.
(내가 뭔가 잘 못 알아서 그런건가??)

export async function getServerSideProps() {
  const queryClient = new QueryClient();
  await dbConnect();
  const result = await Product.find({}, { createdAt: false, updatedAt: false });

  const products = result.map((doc) => {
    const product = doc.toObject();
    product._id = product._id.toString();
    product.firstmeet = product.firstmeet.toString();
    return product;
  });

  await queryClient.prefetchQuery("posts", () => fetchPosts(products));

  return {
    props: {
      dehydratedState: dehydrate(queryClient),
      products,
    },
  };
}