How to define `waitUntil`?
Solution:
I suppose it's in this way:
...
import { after } from 'next/server'
import { after } from 'next/server'
need advice with building e-commerce application
Hey folks I'm building E-commerce app for the first time obviously I will need an Storefront and Admin Dashboard for this considering I have this domain
example.com Storefront will be hosted on example.com while Admin dashboard on subdomain admin.example.com first thing is this approach good or I should have entirely different domain for both thing and second thing I need help with how should I approach the auth for this a centralize approach with RBAC( Role Based Access Control ) where I...is there anything wrong with data fetching , accessing state in next js templates?
i am fetching data of my app inside a template.tsx the data is set as state using zustand , i then access that data using the zustand store this is all being done in template.tsx file of my home directory which has almost all the application pages is there anything wrong with this current implementation ?
Best ui tools for drag/drop with folders and lists in a sidebar nav ?
My app has alot of lists in the sidebar and i need to add folders, i want users to be able to add a folder and move lists into a folder all in the sidebar - im thinking a bit like how apple music desktop app sidebar works. I looked in a few popular css libs and cant see anything like this? also i dont really need a full lib just a solution for this - thanks
onMouseDown not accessible for keyboard users
I was watching this theo video https://www.youtube.com/watch?v=yaMGtiPckAQ and started to implement onMouseDown isntead of onClick for all my buttons. However I ran into a problem where now users cant use the buttons anymore with tab + space. Anyone has a fix for this instead of making a custom button component?
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 } }>) {...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!...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....
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....
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?...
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....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>.
...
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 }
Multiple PDF's not supported?
Are multiple PDF attachments not supported for Claude 3.7 (Reasoning)? I am adhering to the 100 page limit.
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?
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....
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 :)...
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...
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!...
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)
