TTC

Theo's Typesafe Cult

Join the Theo's Typesafe Cult server to ask questions!

Join

TTC

Theo's Typesafe Cult

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

Join

Kenzo

7/8/2024

Caching does not work with trpc in Next, what would you do?

Hi, I someone in trpc discord said: Currently documented tRPC cacheing methods (https://trpc.io/docs/server/caching) won't work as they rely on setting headers which NextJs now overrides (https://nextjs.org/docs/app/api-reference/next-config-js/headers#cache-control) And this is a big problem, what's a good alternative if I really need to cache my trpc calls?...

AlexAnarcho

7/8/2024

trpc server actions: experimental_nextAppDirCaller

So, I saw this in one of the recent videos that you t3 rockstars are doing gods work and adding server actions to trpc: https://trpc.io/blog/trpc-actions So, I am trying to implement this, but am constantly running into issues. Would be LOVELY to get a video from Theo explaining the best way to use t3-stack with server actions and shadcn forms. Like the happy path. Maybe its just not finished baking, so i m premature in my question here. But if anybody got trpc working with server actions let me...

Ani

7/8/2024

Imports and exports not working turborepo

Using create-t3-turbo I have declared Projects in the db schema: ```ts // schema.ts export const Projects = pgTable("projects", {...

TheSwordBreaker

7/8/2024

Next.js Slow Page Load in Dev upto 2 mins

```jsx /** @type {import('next').NextConfig} */ const nextConfig = { // reactStrictMode: true,...

Nghĩa dev

7/8/2024

Serverless function runs right after edge middleware is invoked, overriding built-time data

Hi all, I'm running a content focused website for my company using sanity for cms (with groqd for type-safe query building) and next-intl for i18n. Since going live I saw that the sanity api request bill is racking up even though I've set the request to sanity to be cached. Checking out the logs on vercel's dashboard. I noticed that it runs the serverless function again right after everytime the middleware cached is invoked and call the data from sanity again. This is different from what how it is in the POC project I mocked up with similar packages where only the middleware is called and there's no additional request to sanity Have anyone ran into this sort of issue? I would really appreciate the help. Thanks in advance...

bluetomato

7/8/2024

Noob can't get getStaticProps() to work – props in my Page are always undefined

Not a noob to programming in the slightest, but extremely noob to React/ NextJS. I wanted to try building my next site on this stack and while I'm enjoying it so far, I immediately hit the snag from the title. All I'm trying to do is get some props and pass it to my Page. I feel like I'm following the examples to a T, but the props are always undefined, in both dev and after a build. If anyone can tell me how I'm being a dumbass here, I'd appreciate it massively ❤️ Slightly trimmed gist of my gallery.tsx: https://gist.github.com/SenshiSentou/9173319ec8da82af805a83b470019e5e...

Solution:

Giving the props object a key and matching this name on the Gallery function's param solved it

Jotas

7/7/2024

Whats the point of this ternary operator in the nextjs homepage of Create T3 App?

I thought i knew my nextjs, but there is a

{hello ? hello.greeting : "Loading tRPC query..."}

{hello ? hello.greeting : "Loading tRPC query..."}

while hello is

export default async function Home() {
  const hello = await api.post.hello({ text: "from tRPC" });

export default async function Home() {
  const hello = await api.post.hello({ text: "from tRPC" });

...

Gucci Mane in 2006

7/7/2024

Unauthorized 403 error

Failed to load resource: the server responded with a status of 403 (Forbidden): uploadthing-prod.s3.us-west-2.amazonaws.com/{file.key}. I tried changing uploadthing-prod.s3.us-west-2.amazonaws.com/ to utfs.io/f/ No avail. ...

Paulo Martins

7/7/2024

About Theo's take of not destructuring props

I can't remember in what video exactly, but I heard Theo saying something about using component props without destructuring them. I gave it a go but stumbled on some scenarios where I'm really scratching my head to know how to do properly without destructuring. Basically it's a matter of default values and prop forwarding 1. Default Values...

Isaac

7/7/2024

How to generate files and upload to Github?

I'm trying to generate files on my nextjs/vercel app and then upload to a new private repo on the user's github account. The user currently signs in using GitHub OAuth, how can I do this?

BillyBob

7/7/2024

Zod, Non numeric string

How can i with zod enforce something to be a string and make sure it doesnt contain any numbers

7/7/2024

Route workin in Dev and not Prod?

Hey guys I have a route defined (code below) that in dev works fine, I call it with PUT and it does just that fine. I am using latest NextJS 14 and am hosgting prod env in Vercel. In prod I get: ```js Request URL: https://xxxxxx/api/defendants?id=13 Request Method:...

Kar olis

7/7/2024

Azure blob storage

Hello, I'm using T3 stack and want to send image (Buffer) to azure blob storage in back-end (await blockBlobClient.upload(...)). However, I get error: "Code": "MissingRequiredHeader", "Message": "An HTTP header that's mandatory for this request is not specified.\nRequestId:...", "HeaderName": "x-ms-blob-type" ...

Solution:

Update - managed to fix it. I had error before my file was in storage, thus blobHTTPHeaders was needed after the fix. I use yarn as package manager and with it installed Azure blob storage. Turns out, problem was with packages (modules). I don't know if it didn't install all packages, they were old version or something else, but I had to: 1) Delete node_modules folder 2) Delete yarn.lock file 3) Run all packages install again (few times)...

xSenny_

7/7/2024

NextJS route.ts gets a 504 Gateway Timeout

Here is my code, I am basically fetching some data from mongodb and get this error. Everything works fine in my local build, but not while hosted on vercel. Here s my code...

Palascat

7/7/2024

do you query the localstore everytime to get the token before making api calls ?

Is it good practise to pick up token from localstoreage for every api call ? Context: im working with a very old legacy codebase which usses oidc client with react. There is no auth cookies, jwt token is stored directly into local storage. The issue: if the token expires lets say in 2 min. Oidc client makes calls to auth server for token renewal. And stores this token in the local store. But this change is not picked up the axios instance. It keeps using the old token....

Rajan

7/6/2024

Unexpected error in delete-image server action in Theo's modern react tutorial

So I was following Theo's react tutorial to build an image gallery, I'm facing an issue in the fullPageImgView modal, where, when the delete button is clicked ideally it should route to "/" path but for some reason it calls the getImage function which is only present in the fullPageImgView component which eventually returns the error I'm getting. in short fullPageImgView func is getting called again after deleteImage call resulting in getImage call fullPageImgView.tsx component ```javascript import { clerkClient } from "@clerk/nextjs/server";...

Revaycolizer

7/6/2024

Unable to upload files after deploying on vercel

This is how I implemented it but, does not seem to work as I get an error stating that no such file or directory '/vercel' ```ts const filename = fileURLToPath(import.meta.url); const dirname = path.join(__filename);;...

Isaac

7/6/2024

Backend Architecture - Programmatically generating files and pushing to user's GitHub

Hey guys, I figured this would be a good place to get some input on how to go about this... So right now, I have a NextJS/Typescript app set up with GitHub Auth. The user fills out a form that which then gives me a long command line string to generate some files (using yarn/npm) -- I have up to this point done now. What I'm wondering about is this next part though, I want to run this command somewhere (Separate Linux VM? Right there on Vercel?) to generate the files, and then I also want to upload them to a new private repository on their GitHub account. Not sure what the best way to do this is. For some context, this app is fully hosted on Vercel, but I'm not sure I'll be able to just npm/yarn install stuff and create/delete files on Vercel's server. I'm thinking......

marv 🍵

7/6/2024

New to the t3 stack and tRPC, how do I share code between route functions correctly?

Maybe I'm going about this the complete wrong way. Basically, as you can see below I am trying to create two different routes that share a lot of logic that I want to make into a function. I tried making a function outside of the discordRouter but I couldn't figure out how to type ctx correctly, so any thoughts would be appreciated. What I've tried so far is import { type createTRPCContext } from "~/server/api/trpc"; then type Context = ReturnType<typeof createTRPCContext>; but that's a promise for the context and I feel like I'm going about it the wrong way. ```ts import { createTRPCRouter, protectedProcedure } from "~/server/api/trpc"; ...

deviana

7/6/2024

should we stop using useMemo and useCallback in react v19?

And is it safe to remove my old useMemo and useCallback?

Previous Next

Gaming

Programming

Theo's Typesafe Cult

Join the Theo's Typesafe Cult server to ask questions!

Theo's Typesafe Cult

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