Nextjs 14 Simple Filtering Tutorial Server Actions, React Query Drizzle
Вставка
- Опубліковано 27 вер 2024
- Join Brilliant using the link bellow for 30-day free trial + 20% off the premium subscription brilliant.org/...
Check out my web dev courses below🔥
developedbyed....
👨💻Connect with me
Twitter: / developedbyed
Instagram: / developedbyed
Github: github.com/dev...
---
🎶 Dope tracks🔥
Enough Cereals - Foresight chll.to/7f81611e
Yasper - Little Help chll.to/7f5825ec
Axian, Lazlow - Slinky chll.to/617c119b
Blue Wednesday, morningtime - Brush Strokes chll.to/f8d44967
#react #nextjs
Hope you enjoy this one 🔥
If you want to also limit the number of requests you get back, you can use something like Drizzle's gte (greater then) function with the eq function. So your paramater can have something like 50:number, so you can fiter out ids that are below 50 for example 👍👍
There is a cool article `How I Use Adapter Pattern in React` where we should adapt data to our frontend logic and structure. It looks really cool and no need in pain. I usually create an abstract function `Data Layer` (for examle: api/products-tag) and export getAll where I use ProductTagAdapter with frontend relevant interface. And then it's easy to use such functions in server actions or hooks.
Thank you for this video. It helps me in my real project to integrate correctly react-query. I came across some issue that not all docs are updated. Some of the necessary stuff (for example keepPreviousData) I've found on the page 'Migrate'
Hey Ed! This is a great video, but I just wanted to mention that setting up Drizzle and the schema.ts file might seem a bit confusing at first for people who are totally new to this. Maybe you could add a bit more explanation in the beginning to break it down for beginners? It might be very boring to you to explain every detail but most people who come to see this video are like absolute beginners. The video is still awesome! And you're awesome too!
Instead of setting onclick on Badges you can use Link Component,
By which you can make this component a server component as well
Thank you! More React Query content please!
You can use return type to get types
Very helpful. Thanks so much Ed.
not sure but usually you return data paginated, in that case you can't really do it all on the client, right? Since you want to filter the WHOLE data and show the matches (hopefully paginated as well)
how we can add loading while filtering the data and fetching from api, is it possible?
Hey bro any plans on updating fullstack react course on your website? it's been a year !
Great pattern here with React Query. Any chance for a repo link for this one? Thanks for your great content!
This is a great video bro🔥❤
What's the reason for making the getter function(s), i.e. getVariants, a server action versus just a regular async function?
EDIT: I figured this out the hard way after encountering the error [Functions cannot be passed directly to Client Components unless you explicitly expose it by marking it with "use server".]
This still makes little sense to me, can you shed any light on why these getters need now be server actions?
I can't seem to find this anywhere - how can I fetch data using ReactQuery and consume it in a server component ? It seems like everyone is prefetching on a server component -> creating a child component to actually consume the data.
Can you do nextjs with nodjs server seperatly also jwt auth with nextjs
Isnt get varianta a server function? You are calling your db inside it and then importing it client side? Or am i misunderstanding something?
Thanks!!! 🎉🎉🎉
I love you man❤✌
hi , is this in the next course? thx !
Oh god. I don't wanna say it. FIRST¿ 😂
What ‽
¿
thank you very much bro
Where's the github repo?
Why you are loading products on client side