astro•7mo ago

trpc + server actions

i wanted to use trpc without react query like with next's server actions but using a relative url throws error

import React from "react";

export default function ProjectList() {
  async function getProjects() {
    const data = await fetch("/api/trpc/getProjects");
    return JSON.stringify(await data.json(), null, 2);
  }

  return <pre>{getProjects()}</pre>;
}

import React from "react";

export default function ProjectList() {
  async function getProjects() {
    const data = await fetch("/api/trpc/getProjects");
    return JSON.stringify(await data.json(), null, 2);
  }

  return <pre>{getProjects()}</pre>;
}

2 Replies

astroOP•7mo ago

also suggest how to setup trpc with next's app router currently im creating a server folder in src with index.ts and trpc.ts and inside /api i have /trpc/[trpc]

BeBoRE•7mo ago

https://trpc.io/docs/server/server-side-calls

Server Side Calls | tRPC

You may need to call your procedure(s) directly from the same server they're hosted in, createCallerFactory() can be used to achieve this. This is useful for server-side calls and for integration testing of your tRPC procedures.