Correct tRPC implementation (NextJS AppDir)
Hello !
I'm a little bit lost on the tRPC examples, especially on "examples-next-app-dir"
When should I use this :
https://github.com/trpc/examples-next-app-dir/blob/main/src/trpc/server-http.ts
...
how to import superjson in express?
"The current file is a CommonJS module..."
I set module to Node16 and moduleResolution to NodeNext but still not working, any clue?...
Is it possible to have more than one TRPC client (React Query)?
For example, if i have a multiple TRPC endpoints I want to communicate with
How to try a Post request?
TIL I can't use Postman to try Post requests due to how tRPC handles requests.
What can I use? Is there a simple way? Is there a client similar to Postman with a tRCP extension?
Thank you so much...
tRPC with Next Intl
I'm getting errors when use Next Intl with Trpc App Router
When I call the route, the middleware from next intl change the route to set the locale first [en-es] and the 404 in the route.
https://next-intl-docs.vercel.app/docs/routing/middleware...
Invalid response or stream interrupted
I get this error only on vercel. Everything works fine on my localhost. (Even build mode).
Any suggestions of what should I do to fix it?...
Checking the connection status from the client side
I am doing nodejs to nodejs subscription, and I can't figure out how to check the connection status from the client side in both sse or ws approach so I can handle on disconnect.
Suddenly started getting a `TRPCClientError: Unexpected token '<', "<!DOCTYPE...` error
And my whole app can't run, I've been at it for the whole day. Using React Vite with the React Query integration
Is having multiple tRPC instances in a single monorepo package an anti pattern?
Hi there!
We are currently refactoring a large monorepo and we are torn on deciding the best approach in terms of trpc.
We used to have two monorepos we are now merging and it seems to make sense to now have a single package for trpc. ...
Can I use WebSocket with tRPC for the card game
I am going to create a card game using tRPC for getting the data from server to client. But, I was already using xmpp for user presence, multi-chat etc. But, now I want to try it out with the tRPC. Is it a better idea?
Then, I might need to create a timed game / un-timed games, live streaming etc., based on the game. So, how will webSocket will help this with tRPC.
What would be the good idea? Can you guide?...
How do I implement API key authorization along with JWT authorization in tRPC?
Hello,
I want to make some routes protected and to be accessed by either JWT auth or by API keys auth. So I check both auth methods in the same context.
To make things clear i will just share the code of my
context:
```ts...How to check websocket is alive from client?
Hi, I am new to trpc, might I know how can I check the websocket connection is alive from client side? (I am doing node to node call)
I tried to subscribe from the client and then close the server, but there is no error or something I can tell the user the connection is dead....
Call and await multiple mutations within one clientside procedure
hey all, does anyone know of a nice way to call & await multiple tRPC requests inside a procedure or within one mutation?
reason being is i'm building a blockchain app, and we have to implement flows like this:
```
1. trigger a mutation on our server, recieve back data for a blockchain transaction...
Solution:
looks like i can do this after all with the
mutateAsync return type!Attempted import error: 'hashQueryKey'
./node_modules/@trpc/react-query/dist/createHooksInternal-063195fc.mjs
Attempted import error: 'hashQueryKey' is not exported from '@tanstack/react-query' (imported as 'hashQueryKey').
./node_modules/@trpc/react-query/dist/createHooksInternal-063195fc.mjs
Attempted import error: 'hashQueryKey' is not exported from '@tanstack/react-query' (imported as 'hashQueryKey').
Is there a way to call procedures more directly without a router?
I read the blog post about server actions and wondered if there's a way to use a query or mutation more directly.
Does it even make sense to use a procedure more directly? I was just wondering how to more closely colocate a procedures usage near a component. About 80% of the time only a single component will need a mutation (e.g. specific form or a certain data table with component specific data)....
Issue creating server - v11
I have nest.js app and I am running tRPC inside of it, however when I want to instantiate router I get typescript errors:
`private readonly trpc = initTRPC.context<ContextType>().create();
middleware = this.trpc.middleware;
procedure = this.trpc.procedure;...
I can't read the value of the env variable, it returns undefined
I am building my application with nextjs using trpc and with drizzle+turso as the database, but when I perform a database query in the trpc route, the terminal reports an error and it seems to be unable to read the value in the env. The image shows my trpc route, drizzle and env files respectively
Next.js/tRPC Prefetch w/ HydrateClient "Error occurred prerendering page"
Hello all, I'm trying to get to the bottom of an issue I'm having using prefetching with HydrateClient. I'm using the t3 stack, so I believe that HydrateClient is a helper function wrapping tRPC
helpers.dehydrate()...
When I run this code with pnpm dev, it works fine, but when I go to pnpm build, I am getting
```
Error occurred prerendering page "/queue". Read more: https://nextjs.org/docs/messages/prerender-error...Solution:
I FIXED IT! Stupid mistake, I wasn't marking the root page function that was performing the prefetch as
async... i.e:
Broken:
```ts
export default function QueuePage() {...Compiling Frontend
In my frontend, I try to import the backend types:
- import type { AppRouter } from "../../../lambda/api-handler/src";
however, now my frontend cannot build as it has a different typescript configuration than my backend. What is the intended solution here? Is it possible to import these types without using a single tsconfig/build step across backend and frontend?...
How do I return a plain text in trpc?
I want to return an ‘ok’ directly in the return data, not {result:{data: ‘xxx’}}