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

sukhesh

4/17/2025

How to await params?

Hello, scoured stackoverflow and enlisted the help of some LLMs but couldn't figure this out (maybe i need sleep). I get the error: Error: Route "/[baseId]" used params.baseId. params should be awaited before using its properties. Learn more: https://nextjs.org/docs/messages/sync-dynamic-apis at ProjectPage (src/app/[baseId]/page.tsx:14:24) 12 | export default async function ProjectPage(promise: Promise<{ params: { baseId: string } }>) {...

Chemist

4/17/2025

T3App session not set

Spun a new app with AppRouter, NextAuth, TRPC and prisma with sqlite, have added my discord auth and can confirm working (can see session in db). However session is still undefined and have no idea why. I can technically fix it by adding SessionProvider but I dont think this is the right choice when using AppRouter. Thanks!...

The Untraceable

4/16/2025

Adding extra data into uploads

Hi. I'm just getting started using UploadThing in my new NextJS Application. I have uploads working great, and I am using onUploadComplete to store the entry in my Database. I want to make it so that the user can add extra data, more precisely how long the file should be stored for before it's automatically deleted, how many times someone can view the file, etc. Would this be possible with UploadThing, and if so, how? I am using NextJS and just followed the basic guide, nothing extra setup. Thanks. One workaround I think could work is letting the user add on that extra data before upload, and once the client callback is called, make a PATCH request to my API (which stores the upload info), and just update the database info there....

vpjm

4/16/2025

Re-Design React Compoent

Hi, I had a really hard time trying to type React components that accept other components as parameters. For example, a component that takes Header, Body, and Footer along with their respective props. Handling just one is manageable, but things get much trickier when a parent component takes several of these kinds of components because it then becomes responsible for merging all the parameters of its children, and the types become very large with lots of generics....

Iker

4/16/2025

Email Validation purely from frontend

Hello everyone, If i have to implement an email verification service on submitting a form purely in next js, then what are the best ways to go about it?...

Bozhidar

4/15/2025

Best way to render "statically-known" dynamic data in Next?

In the pursuit of creating the fastest possible page load experience, I keep running into this dilema on how to optimize this specific case and I'm curious to see how y'all would approach it: I have a page that renders a list of statically known items, which are known at build time. NextJS does a great job of realizing this and statically rendering the page, caching on the CDN when deployed to prod. However, I need the otherwise static list to be shuffled differently on every page reload. The list in question is above the page fold and immediately visible to the user when they open the page. I don't want the shuffling to slow down the page load or cause layout shifts and flashes, if possible. I believe my options are: 1. Force the page to be dynamic, render in NodeJS. The benefit here is that I am making minimal code changes and no client-side JS is being sent to shuffle/resolve timer after hydration - the HTML already has the items in the right order! However I don't want to spin up a Lambda and wait for its cold start just to shuffle an array and I think this certainly degrades load performance. I considered using const revalidate = 0, but I am not sure if this is the best way to achieve this....

Nat

4/15/2025

When to use NextJS instead of just React?

TL,DR: For anything not business related, are there usecases better suited for Next than plain React+Vite, vanilla JS and some libs?

Asking here because I haven't quite understood from my research (I may be stupid :happy: ). My background is as a Game Developer, am currently learning front-end with a few one-page projects, and my backend experience is limited to university projects and SQL queries. In games, we typically have the user's machine store and process everything (even something like Wordle could use a local library and pass a date to get a word). So when I began front-end stuff that was my approach as well, first with just vanilla JS (like those Hyperplexed videos) then moved to React. Even when I made forms they'd be processed in the client to generate a final result....

Solution:

That's a very interesting question! 😊 And, as always, the answer depends on the specific needs of your project. (I know that sounds a bit vague, but stay with me—I'll explain.) If your application or website relies on SEO—for example, a blog or an article-based platform—then server-side rendering (SSR) is essential. In this case, you'll want to ensure all the necessary data is rendered on the server so that crawlers can index a fully populated HTML page, instead of just seeing an empty <div id="root"></div>. ...

Bored Student

4/15/2025

TS copy with `with` syntax

what is the closest to with syntax like this

let originalPerson = { Name = "Alice"; Age = 30 }
let updatedPerson = { originalPerson with Age = 31 }

let originalPerson = { Name = "Alice"; Age = 30 }
let updatedPerson = { originalPerson with Age = 31 }

...

TeamDuck

4/15/2025

Multiple PDF's not supported?

Are multiple PDF attachments not supported for Claude 3.7 (Reasoning)? I am adhering to the 100 page limit.

charlie-b

4/14/2025

In T3 Chat - What causes a thread to be created?

I only see threads for some of my chats not all of them, what causes a new thread to be created?

Filipi

4/14/2025

Suspense Boundary inside `layout.tsx` with `ppr` and `dynamicIO` enabled

Hi guys, I was watching theo's video on why is next.js so slow and my mental model for DynamicIO + PPR went downhill after the part he adds a Suspense wrapping children in the layout and that doesn't work. I've tried to follow the explanation but I didn't really get it why it didn't work... I thought the compiler would pre-render everything until the first async component for that route (including layouts) and put that in the static bundle for the route. Can anyone please explain what I'm missing here?...

Solution:

I consider layouts to generally be static in the sense that they don’t re-render once delivered. Their children update, but they don’t normally. https://nextjs.org/docs/app/getting-started/layouts-and-pages Suspense doesn’t work after first render because on first render, the generated layout sees that the child is streaming in, and therefore shows the Suspense boundary fallback. When we return to or move to a dynamic component after this, it’s slotting in the child but doesn’t re-run the suspense because the layout doesn’t re-render, preventing the suspense from running. Suspense can only run when a component is dynamically mounting/rendering or slotting in, and since the layout component doesn’t do that on change for child components, it can’t properly trigger the suspense within the layout component. The suspense also wouldn’t run if we refreshed or started on the second page or static page, then clicked on first page for the same reason. The suspense being in layout isn’t “wrong” (it works on page load if you’re on the dynamic component), but it just isn’t useful because layout doesn’t re-render at all. Suspense is better off being placed in a component that consistently rerenders with the dynamic component we’re trying to account for....

mitchellmyers

4/13/2025

Nextjs Use Cache does like 8 Edge Request

Has anyone experience with the Nextjs "Use cache". I was trying to implement the previous behaviour of next 14 caching but the revalidation for dynamic routes is not working yet. Also when i navigate between two routes it does like 8 edge requests. i got no clue where i should start debugging or how this can be fixed. if anyone got experience in that pls hit me up :)...

Jack @ DJL

4/13/2025

Next/Font no require() on ESM Graph with top-level await

Hello People, Im having issues in a mostly fresh create-t3-app, the entire log and repo and code and more on this gist: https://gist.github.com/JackatDJL/a4df3f05362b8fcd04c375bd2d6a4d1d...

Vachan MN

4/13/2025

Good RBAC implementation for create-t3-app?

Hey, I was looking for a good Role based access control implementation example or library that I could use with ct3a. If anyone has any references, please do let me know. Thanks!...

Inalite

4/13/2025

Error uploading file

When I try uploading a file on UploadThing I get this error: "Error uploading file" What I have done to try fix the issue: - Switched browser - Verifying no file with the same name was already uploaded...

Solution:

The error was fixed once I created an API key... (as I deleted the one set by default)

Vishnu Mouli

4/13/2025

Using Package level .env in Turborepo

I have apps/ web and packages/db folder. packages/db src index.ts...

Kris

4/12/2025

silly question about cloudflare worker billing

hi. i'm currently screwing around with cloudflare workers to see if it's viable for a thing i want to make. i'm using the free plan and i very specifically do not want to be charged (but cloudflare has my payment details because i'm using the free tier of r2). my understanding is that the free tier of workers limits you to 10ms CPU time per request and just kills the worker after that. and yet my median CPU time is showing as 617ms, see the attached image. is there a way i can verify if this is right or not, and more importantly, is there a way i can check if cloudflare has suddenly started billing me for workers paid or not...

Solution:

craftzcode

4/12/2025

Always failed to fetch the image url

I don't know if my internet is slow, I couldn't fetch the image from uploadthing, even I direct to visit the image url on the browser.

Mocha

4/11/2025

App Router & tRPC Server Cache

How do you handle caching server queries with tRPC? I refuse to believe there's no good & easy way to do that. What am I missing? Client Components feel faster as it's easy to cache the response on client. Server Components feel fast on first load but trigger queries on every render, making it feel slower. Currently using:...

Roshidoniy

4/11/2025

How NextJS REALLY Works

Is this still good video to understand how Next actually works?

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.