tRPC

T

tRPC

Move Fast & Break Nothing. End-to-end typesafe APIs made easy.

Join

Fastify + TRPC on Vercel

I am having trouble hosting a Fastify + TRPC server on Vercel. I have tried two different vercel.json setups, but they both do not work for each reasons: ```json { "rewrites": [...

Is it ok to have 2 clients in one app

Hi, as for the topic, is it okay to have a standalone client and a react-query integration? I have a trpc standalone backend in a monorepo with nextjs frontend, so far I've been calling my backend only from server components, now i think i will need react query functionalities in the client components, is it ok to have both standlone client and react query intefgration or is there a better approach?

Duplicated tRPC server-side calls

Hello, I'm using the CT3App tRPC implementation, server-side, with createHydrationHelpers stuff from @trpc/react-query/rsc I'm also using generateMetadata function from NextJS App Router. ...

Is it good choice to use tRPC if I don't use monorepo?

Is it good choice to use tRPC if I don't use monorepo? If so, how can I get the types and everything on client side? I can use shared NPM module, but it won't be painful to do that?

Equivalent to middleware on createNextApiHandler

Hey, I'm currently migrating our trpc app to the app router and wondered what the equivalent to the middleware property here would be in app router: ```ts import { createNextApiHandler } from '@trpc/server/adapters/next' ...

Issues with setting up t3-create-app and server side events(SSE)

Hello, I'm using practically out of the box t3-create app and try to set up project with using SSE. I've added splitLink and simple subscription onPostAdd as in example from docs page(https://trpc.io/docs/client/links/httpSubscriptionLink) However, when try get this sub on client api.post.onPostAdd type of onPostAdd is...

Is it possible to use tRPC React Query Integration without defining a trpc provider?

When using react query without tRPC the query client can be passed as an argument when using the hook. Example: const { data: inquiries } = useQuery( { initialData: data,...

Is it possible to request directly from user's browser rather than using a server proxy in trpc?

I have been using trpc in my project and it's been working really well. However, some requests need to be sent from the browser to the target API instead of our server. I am considering creating a React-Query API wrapper directly, but I'm concerned it might not align well with trpc usage. Is it feasible to implement something like this: ```ts import { api } from "~/trpc-browser" const res = api.something.useQuery()...

Procedures with paramters.

Is it possible to pass parameters to a procedure in TRPC? I want a procedure that first checks if the user is signed in by default. But then I also want to be able to pass an array of permissions for the user to have, when the actual procedure is used in a route.

Prefertch() privateProcedure (Clerk) in gSSP

Trying to do that I'm getting "UNAUTHORIZED" error. I see that for creating prefetchHelper I use createInnerTRPCContext without passing auth data to it. Does it mean that it is impossible to fetch data from privateProcedure using prefetchHelper ? Or there are some recomendations how to do this with tRPC? (I know that I can just do Clerk auth check and make Prisma call after, but I want this data to be cached and passed to React-Query) ...
No description

The string did not match the expected pattern

Hi, I'm trying tRPC out for the first time. Everything went very smooth up until trying to query something from my frontend (which is SvelteKit) I get the error in image attached. ```ts <script lang="ts">...
Solution:
Well, I figured it out. Seems somehow ngrok was the problem anyway. Since HTML was being returned (the ngrok browser warning screen), the json deserialization was failing, resulting in this error. To fix, I added the ngrok-skip-browser-warning header, which worked: ```ts const trpc = createTRPCClient<AppRouter>({...
No description

Need help with performance

Hello, tRPC is still dreadfully slow for us. It's borderline unusable without disableSourceOfProjectReferenceRedirect": true in tsconfig.json. I've realized that it's partly because we load all procedures from all routers into memory on every autocomplete access in the TypeScript language server. How can we split up the routers? I read on GitHub that maybe they should be separate packages, but how would that even work? We specifically need to be able to infer the types of specific routers so that our TypeScript language server doesn't slow to a halt....

How to build the raw http request for trpc route?

Is there any documentation on how to build a raw http request for a trpc route? I have my trpc backend server but on the frontend i'm not using javascript/typescript so I need to call the api with a custom request

Clarification on inconsistency between React Query + tRPC docs with serialization

Hey everyone, I have a quick question. I have been exploring using different serialization methods + learning more about tRPC / React Query as a whole. In my deep dive on the React Query docs, specifically on the Server Rendering & Hydration Serialization section, they mention that superjson is unsafe to use on the server, and recommend using devalue instead. See here, last paragraph: https://tanstack.com/query/latest/docs/framework/react/guides/ssr#serialization But then, in the tRPC docs, it actually says the opposite, almost verbatim: https://trpc.io/docs/server/data-transformers#different-transformers-for-upload-and-download...

Correct types and payload for the applyWSSHandler with createContext

Hey everyone, I'm using t3 stack and trying to add websocket handler for my setup. I'm following this example - https://github.com/trpc/examples-next-prisma-websockets-starter. My create context func looks like this:...

I notice Authorization is been removed from my header on my dev environment

```typescript api.createClient({ transformer: superjson, links: [ httpBatchLink({...

404 on vercel deployment

Hi everyone, I'm working on a Next.js project called Codeshares and I'm encountering a 404 page with no errors when I deploy my application on vercel. The app works fine in development, but fails on deployment. I suspect the issue might be related to my routing since index is supposed to be the root page. I have some logs that seem off:...

Nested tRPC procedures.

I'm trying to convert a REST API structure to tRPC. Specifically, I want to replicate the nested REST route products/:productId/discount in tRPC ? . How should I declare and organize these nested routes in tRPC to match this structure effectively?
Solution:
there is no reason for the nesting here because you only have one procedure inside the nested routers

tPRC ERROR on T3 stak

I just initialized a folder with the "T3 Stack". The stack is: - Next.js with typescript - Prisma as ORM with sqlite - tRPC...

How to add signal on mutateAsync?

const stream = await ask.mutateAsync(data);
const stream = await ask.mutateAsync(data);
i want to parse signal there...