Thank you so much for this amazing tutorial. Trying trpc for the first time and I was able to understand pretty much every thing. Keep up the good work!!
Thank you so much for this! wasn't familiar with tRPC in the T3 stack, but this made it very clear. Watched your v10 of tRCP video beforehand to follow along and it worked out great.
Thank you Josh, I'm noticing that the api changed so much (too much haha). I could finish it using the new features and using modifying the cache instead of crating states. If anyone wants the code just comment it.
Planetscale just didn't want to connect. I followed all of the steps in the video and I kept getting P1001, I must be cursed to never go into fullstack lol
So is the T3 Stack used as a full-stack framework where you have the backend and the frontend together in one project? What if we wanted to split the project? Great video btw sat through the whole thing!
I'm having problems updating my state after fetching data with tRPCv10. I understand they've changed to a conditional status check instead of callbacks as arguments in the useQuery() method. However, when trying to update the state in a conditional status check: const data = trpc.shoppingItem.getAll.useQuery(); if (data.isSuccess) { setItems(data.data); } then we get an "Too many re-renders" error because of the infinite loop caused when the state is set, then re-rendered, that re-render causes another success status, thus another re-render. Does anyone know how to update state with tRPCv10?
You have to put it in an useEffect hook like this: const {data, isSuccess} = trpc.shoppingItem.getAll.useQuery(); useEffect(() => { if (isSuccess) setItems(data); }, [isSuccess, data]); Edit: you can actually use onSuccess as the second argument like this: const {data, isSuccess} = trpc.shoppingItem.getAll.useQuery(undefined, { onSuccess: (data) => setItems(data) }); First argument is the input but since we're not using it, we can put undefined instead
Just subscribed as I'm beginning on T3 stack. Keep going on the good work :) Just one thing, how did you quick select + delete the main jsx block at ua-cam.com/video/e4Zq0FCuWhw/v-deo.html ?
"i don't really like firebase" = instant subscription
Hello, very good tutorial! Thanks
At 25:05 I would suggest to make use of React Query refetch instead of adding the response into state.
Wow finally more T3 videos! Thanks great video and you got a new sub 😁
Cheers, glad you enjoy the stack as much as me! Great tool for building full-stack
Thanks for the amazing content. I just got a much better understanding of prisma and tRPC. All thanks to you. Keep it up!
Cheers, happy to hear that
Nice!!! Love that you are using copilot like not a big deal!!
Thank you so much for this amazing tutorial. Trying trpc for the first time and I was able to understand pretty much every thing. Keep up the good work!!
That's defentely the kind of video i like !
Thank you so much for this! wasn't familiar with tRPC in the T3 stack, but this made it very clear. Watched your v10 of tRCP video beforehand to follow along and it worked out great.
I learned a lot from this video. Thank you so much! look forward to your next tutorials
How do you do the in-line / within-the-line commenting out? 15:30
Thank you Josh, I'm noticing that the api changed so much (too much haha). I could finish it using the new features and using modifying the cache instead of crating states. If anyone wants the code just comment it.
Hi, I'm finding it difficult to follow the tutorial. Would you mind linking the repo?
@@SSSNIPD I didn't push the code. But look at the documentation, is relatively easy to follow
Real nice video, keep up the good and clear work!
This tuttorial is the newest i can found, i tried it out and got stuck knowing that the folder structure is slightry different :(
can you do this again with trpcv10
My trpc folder structure is somewhat different to yours, even though i'm going with the default installation as you did. Any idea why this is?
I think the problem is that this tutorial is for trpc version 9, the latest version (that you are using) is 10.
So a lot has changed.
@@Tommy-ev6gv That makes sense.. This video was just uploaded so recently, so I hoped I would've avoided that. Oh well. Thanks for the reply.
@MattphL you've been facing problem with createRouter bit?
just watch josh's video on trpc v10 changes and you will be able to follow this video
Planetscale just didn't want to connect. I followed all of the steps in the video and I kept getting P1001,
I must be cursed to never go into fullstack lol
Continue with T3 stack!
Subsribe and like!
Cheers man
Hi Josh, danke für das Video ! Subscribed :)
Any reason why you’re using useState instead of just using the tRPC state and invalidate?
How do i use ssr or ssg with trpc? I don't understand why using next if i useQuery from client.
thank you so much
very helpful for a beginner i. t3 stack like me
youre a wonderful teacher
how are the snippets you use called? they seem useful
Hi, can i know whats extension for vscode you use for the project ? cause im having trouble and very slow in following these tutorials. thanks :D
This is super helpful! Is the snippets for useState and FC an extension or is it built-in on React?
Those are some custom snippets I made for vscode, check out how to do that in this video I made: ua-cam.com/video/Dert_kpLWE0/v-deo.html
So is the T3 Stack used as a full-stack framework where you have the backend and the frontend together in one project? What if we wanted to split the project? Great video btw sat through the whole thing!
It's possible, because T3 Stack is modular. So you can even check off the things you don't need/want to in project.
hey sorry for noob question. how do you get that "autocomplete" when writing functions and queries and stuff?
That's not a noob question, the autocomplete is from a tool called Github Copilot (free for students) :)
I'm having problems updating my state after fetching data with tRPCv10. I understand they've changed to a conditional status check instead of callbacks as arguments in the useQuery() method. However, when trying to update the state in a conditional status check:
const data = trpc.shoppingItem.getAll.useQuery();
if (data.isSuccess) {
setItems(data.data);
}
then we get an "Too many re-renders" error because of the infinite loop caused when the state is set, then re-rendered, that re-render causes another success status, thus another re-render.
Does anyone know how to update state with tRPCv10?
You have to put it in an useEffect hook like this:
const {data, isSuccess} = trpc.shoppingItem.getAll.useQuery();
useEffect(() => {
if (isSuccess) setItems(data);
}, [isSuccess, data]);
Edit: you can actually use onSuccess as the second argument like this:
const {data, isSuccess} = trpc.shoppingItem.getAll.useQuery(undefined, {
onSuccess: (data) => setItems(data)
});
First argument is the input but since we're not using it, we can put undefined instead
Wow really useful
thanks a lot
Just subscribed as I'm beginning on T3 stack. Keep going on the good work :)
Just one thing, how did you quick select + delete the main jsx block at ua-cam.com/video/e4Zq0FCuWhw/v-deo.html ?
That’s a custom shortcut in VSCode called Emmet: Balance (outward)
@@joshtriedcoding Awesome, thanks!
Please add timestamps great video btw
That’s a good idea, will keep that in mind for future long videos
how did i get here?
Idk champ