Cool svg animation insight.
Hello dear front-end engineers,
Can you give me some insight on how this cool effect is implemented in nextjs.org....
tRPC failing on static pages (app router) build on Vercel
When deploying my Next.js app on Vercel (using v13 app router), I come across an error I struggle with during the build phase, when tRPC attempts to retrieve the first data.
I assume the error comes from the API endpoint that exists but fails to execute (else I have another error when
NEXT_PUBLIC_VERCEL_URL is wrong, when I try to log the request, nothing shows). I added logs (lines starting with ###...) and can notice that the URL is good. It works well on my machine if I set NEXT_PUBLIC_VERCEL_URL to localhost, I can only reproduce on Vercel.
Any idea why on Vercel my API endpoint doesn't work well during static pages generation?...
Improve performance - Avoid Re-renders when changing range input used as a volume slider
How would i go about improving this. Right now when you move the slider it'll re-renders all the
Quotes
Im having a hard time wrapping my head around this. My thinking is I would need to manage the sound with useSound somewhere else? or do some type of composition with the components?
If i do the former, then you won't be able to play multiple sounds simultaneously? Idk
Any advice would be appreciated thanks....Possible to do in one loop?
``` "branchMaterials": [
{
"branchId": 1,
"materialBalances": [
{...
Solution:...
groupBy(branchMaterials.flatMap(branchMaterial => branchMaterial.materialBalances), materialBalance => materialBalance.materialName)
groupBy(branchMaterials.flatMap(branchMaterial => branchMaterial.materialBalances), materialBalance => materialBalance.materialName)
Events using prisma
Is there any way I can make some kind of database events using prisma like on create event. I know I can use extend but it's only when using prisma and not for other db connections. Also I find it a little confusing
Clerk authorization custom implementation.
I am trying to implement an authorization flow for one of the in development app we are building. Basically i am able to implement clerk sign in via their out of the box components. But i noticed since the app is publicly hosted via vercel and open in the public anyone can sign in or sign up using clerk through github or google login.
Wanted to make a authorization flow where if the users signing in are emails stored in the db they can get access to the ui if not i would like them to get redirected to a different website. So far tried to implement that but i am having an issue where clerk publishable key is not being read. Not sure if is a clerk limitation, since i don't want to pay their premium feature for blocking or authorizing specific users.
Any suggestions? The app is still in development but also already deployed on vercel so wondering if it is smth that can be done or if is a wrong approach....
NextJS recursively call API route.ts from API route.ts
I have Site, Place, and Element in my database using Planetscale.
Sites are the root, they can have Places and Elements.
Places can also have Places and Elements.
Elements are final....
Solution:
lmao this was dumb, I can make external function and import them wherever I need.
I made a delete.ts file where:
deleteElement deletes all related to the element, including stuff from supabase storage.
...
Sending State with SSGProps
So the content of the web app I want to make is primarily static except for one thing. Is there any way for me to send the state down while using SSG as a rendering strategy
Host T3 app on a VPS
I just delivered a freelance job using t3 and the server provider of the company contacted me to ask if I could get the app running if they provided me ssh and plesk. Is it as simple as just git clone npm build start or should I dockerize the app and serve in a different manner. I have only worked with vercel so far so I can say I'm quite inexperienced when it comes to deployment. The app doesn't have any fancy lambdas or edge parts. What does the process of hosting a nextjs server on vps look...
Microservice and where to host it
Is fastify still the #1 for quick microservice? Where do you recommend hosting it
Single endpoint that can take up to few minutes to resolve
I have my whole backend on nextjs api routes. Everything works great, but right now I need the backend to have an endpoint that can take up to few minutes to resolve, mostly because of calling gpt API, should I go with lambda function or seperate micro service? Are there any other alternatives? What would you do in that scenario? Thx
how to save tiptap/prosemirror content to database in optimal way?
So while multiple clients edit the content, we only send changes through websockets and other clients' editors merge new changes automatically.
But what about saving the content to database? Database service doesn't know how to merge new changes to what is already saved. When we save to database, do we have only these two options:
send only changes to your server and let the server merge it with what is saved in database and save the result to db store. send entire document on your editor with request to save in db None of these options sound good bandwidthwise. I would be really happy to hear what are the best practices around saving to db....
Setting default roles on signUp, NextAuth
Hello,
I want to create a page where admin users can create roles and select what permissions other users have when using the app. But I also want the admin users to give other users multiple roles if they want.
Attached is the prisma schemas I am using. However with this approach when a user signs up for the first time they have no user role, unlike before where I used an enum containing a set number of Roles, but with the enum approach an admin cannot change or add roles....
Attached is the prisma schemas I am using. However with this approach when a user signs up for the first time they have no user role, unlike before where I used an enum containing a set number of Roles, but with the enum approach an admin cannot change or add roles....
How does ct3a launch the cli on install?
Hi! I am trying to build a template/cli app of my own and I've been studying the ct3a github repo (the cli portion specifically), and I don't really have a clue as to how the cli is launched on install!
Currently, my app works by pnpm init -> pnpm install package -> npx package. (Weirdly, it only works if I use pnpm, npm is a no-go).
On a similar note, create-next-app uses npx to launch itself which adds more to the confusion....
Solution:
npm fetches the
create-t3-app package, as well as it's dependencies, and stores them in a cache before executing the command. more details: https://docs.npmjs.com/cli/v8/commands/npm-exec#descriptionsubmitting form results in page reload/url change t3+react-hook-form+shadcn
I'm trying to build a form using react hook form and shadcn form component, but it keeps reloading the page after submit and add the "?username=" to the url (which makes it ignore the validation since it just redirects the url), I copy pasted the same code as shadcn has on his website for testing, still does it, cant figure out the issue.
anyone knows how to fix it?...
Solution:
is there a reason you have
void form.handleSubmit? pretty sure that should just be form.handleSubmitHow to create debounce search with tRPC
So I'm aware that react-query provides a useDebounce hook but I guess tRPC doesn't wrap around this - so I'm wondering, what is the optimal way to create a simple search bar function with tRPC?
If I have something like this:
```
const { data } = api.users.getById.useQuery({ id });...
Vs Code highlighting newlines
I have no idea what ungodly button I've managed to touch but I feel so stupid atm. Vs code is showing some sort of highlighting or selection on a lot of my newlines (but not all of them). Does anyone have any idea what might be the cause?
[possiblo?] i made this garbage code, can you make it better
https://github.com/barrybtw/aktiesparekonto/blob/master/lib/calculate.ts
just lets me know how much money i'd have after x years, how much is profit, how much will be paid in tax, the code is ugly as hell but i dont think it can get better, but maybe someone in here is the einstein of coding and maths...