Theo's Typesafe Cult

TTC

Theo's Typesafe Cult

Join the community to ask questions about Theo's Typesafe Cult and get answers from other members.

Join

How do apps Like Notion handle updating the text content so often?

What I mean is, you can click into a field, type something, click out, and it's automatically saved. I'd like to implement something like this in my own App and am wondering how is this done? Is an API request sent to the backend every time a user clicks out of the field?

Making a form with Zod

I have made my form, its all styled and functional (currently logs the data). I just cant figure out how to display the image as an image within the data.

next image sizing & layout recommendations

I have a small part of my website where I want an image. The code is roughly: ```ts <div className="flex flex-col gap-5"> <div className="flex gap-4 w-full h-full items-center "> <div className="relative h-20 w-20">...

React Query Cache - Does this come with trpc T3 stack?

Does anyone know how to cache data fetched via a trpc route? Typically I'd wrap my entire application in a React QueryClientProvider, but idk if that's how you'd do this in a T3 app....

how to use react query in component that takes id and you render it multiple times

i created a component that fetches data from api and i gave it id as parameter that i use in react query then i render 5 components with different ids and they all end up rendering like they had first id

Stack to build a small game

Hello! As Theo says all the time. We are builders and the best way to get better is by building more stuff. I want to keep practicing building fullstack projects so I decided to create a small game, but I have a few questions if anyone can help: I want the game to be pretty simple since I've done only two small fullstack projects (I only do FE at my job). The idea is to make a game for my friends to play (10 players give or take) in which you have a character with some stats like an RPG and you can decide to fight a couple of times a day. The fights auto resolve and you should be able to fight NPCs or other players. To avoid snowballing the fights would be somewhat random but with more chance to win the better your level / gear is. My question is: How do you think I should approach this? ...

data fetching, loading state, loading skeletons

Hello currently inside my T3 app I fetch the data from external api on the backend and then pass query it inside Homepage.
const { data: recentData } = trpc.recent.getRecent.useQuery();
const { data: trendingData } = trpc.trending.getTrending.useQuery();
const { data: recentData } = trpc.recent.getRecent.useQuery();
const { data: trendingData } = trpc.trending.getTrending.useQuery();
something like that. Then If there is no data, the user sees a loader. Is this the correct approach or should I instead query the data inside specific components that need it? ...

TRPC linting error

im getting this linting error. my trpc implementation is exactry like the docs

413 FUNCTION_PAYLOAD_TOO_LARGE

Hi, with Vercel I'm now finding out that my payloads are too large, to be safe i need to be able to have 10mb, almost double vercels limit This is a file upload which needs to be directly processed by the server, nothing of the file needs to be saved so I'm trying to avoid an S3 upload. What options do I have here?...

How to refetch(refresh) next-auth session manually on the client side?

Let's say the app has two unique models user and profile, both are in a one to one relation. User object will have a field named profileId which can be a string or null depending on whether the user object has a profile linked to it. After a successful sign in we get the user session object back which has profileId === null. Then we force the user to create a profile if they want to make use of all functionalities of the app. So, the user creates a profile which gets linked to their user object in the database. Now session.user.profileId === "somethingId". How do I refresh the session to update this change on client side without any page reloads and stuff? Like doing it the react way, refetch the sesion, set the session state to the refetched value....

Prisma find is acting very weird

I have a user table with a relation field of posts. When I try to use "findFirst" for a user by id, and get the posts using "include: true", I get returned a user with an empty posts array. The array shouldn't be empty. I tried "findMany", and what happens is that it returns ALL USERS in the db, which shouldn't happen, cause there's only 1 user who has this unique id, but the users ARE coming back with a none-empty posts array....

What is the best practice to upload file using multer and create a record in Prisma

Recently I have been obsessed with uploading files with trpc, I have files that I do not want to keep on the cloud server and I want to keep them locally. I've done the uploads with Multer, but how do I associate them to my Prisma, for example Patient table? What is the best practice for this situation?

How to implement this feature using tailwind

In the video they use MaterialUI and StyledFIrebaseUi which for some reason doesn't work now, So I'm trying to implement this sign-in flow using tailwind but I'm not sure how to do this using one modal only

create-t3-turbo naming in package.json files

What does @acme/ stand for? I mostly see it in package.json files.

instagram-reddit type app with socket io

so i am making an instagram/reddit type app where its just a bunch of posts and likes/dislikes/comments I want to implement web sockets so that you can see the likes and dislikes for every post updating live instead of having to refresh page so one way i can do that is when each time a person likes/dislikes then the server will emit to all the other clients and update their data ...

Protect certain route after auth ? NextAuth middleware

Hi is there any possible way to protect my pages after auth in middleware ? i dont want to do it in client side since it will flash the content for a second , and if i do it with unstable_getServerSession it feels kinda toomuch code duplication ? if i have auth i want to protect page A,B,C,D but if i dont have auth i want to protect page E,F,G,H ...

Best database setup

Hello all. I’m starting a fresh app and I wanted to know what are your favorite Postgres database setups with prisma and why. I am intrigued by pocketbase, even though that’s not Postgres, but I wanna know what else is out there. Seems like PlanetScale is standard but I would love to know more about Xata.

Is There A Better Way To Communicate With A TRPC Endpoint When You Don't Want To Re-render?

Hello, I was wondering if there is a better way to send and receive data than useQuery() / useMutate() if you do not want to re-render at all and what you are doing is purely for internal data stuff. I could still just use useMutate(), and then have a effect that is subscribed to its value and then update state but than seems like alot of hoops to jump through....

Make Intellisense Show Programmatic Option First Instead of Component Provider Emmet Abbreviation

Hello, Is there a way to make VSCode show the programatic method of writing a query/mutation instead of the provider method first when using TRPC? Thanks in advance for the help!...