The Ultimate Guide To Next.js Route Handlers - CRUD
Vložit
- čas přidán 3. 07. 2024
- GitHub Repo 👇
github.com/bwestwood11/route-...
Learn how to use the POST, GET, PATCH & DELETE HTTP Methods inside of Next.js 13's app directory.
This will allow you to create a fully functional CRUD operational application.
Route Handlers can be confusing but this video will teach you how to use dynamic data, useSearchParams, HTTP Methods, fetch web API, and more.
Join my FREE Discord to talk and network about web development! 👇
/ discord
Time Stamps
0:00 Intro & Demo
1:58 Go Over the Next.js Docs
4:04 Create a new Next.js 13 Application
6:55 Setup Prisma ORM and MongoDB
15:52 POST Request
29:23 GET Request
44:46 PATCH/PUT Request
1:07:03 DELETE Request
1:14:20 Outro
THIS VIDEO IS FANTASTIC, I'VE LITERALLY SPENT DAYS TRYING TO FIGURE THIS OUT THEN BUMPED INTO THIS VID, COVERS EVERYTHING EXACTLY AS I NEEDED
YOU DESERVE A BEER ON MY TAB
Exactly what is needed. A full rundown of everything important with real examples. Great!
No problem! Thank you for watching!
Just what I was looking for! And finally someone who doesn’t do “User Posts” or “Todos” as examples
Yea I have seen a lot of those, same concept though. Thanks for checking out my video!
Thank you very much for covering the PATCH and DELETE methods !! They are hardly found on YT. Thanks again !!
Great video @brettwestwooddeveloper, doing a NextJS13 project and I'm basically using most of your tutorials as a backbone for our project and it's helping tons. Thank you!
Nice! I am glad to hear! Appreciate the feedback!
Great explanation.
Thank you.
Thanks Again Brett!
No problem!
Amazing Tutorial.
Thank you.
No problem and thanks for tuning in!
I was searching for this
Your notification
Thanks man
Thanks for following!
Well Done Brother..
Thank you!
Grateful as always! Was wondering if you can do a quick vid on how to display unique user data in dashboard other than session data. For example, products/services that a unique seller has created and orders associated with said products/services. Thanks again
thanks for this amazing tutorial please can you do a video about pagination
Great video! You made a video about custom keys in user object using JWT. Can you show us how can we synchronize credentials and google provider accounts of users using jwt token so that an email can only be used in a google or credentials user account at a time and also have custom keys in user object ( in google provider account too ) other name , email , image? BTW your content is most straight forward and logical out there on youtube. Thanks :)
At the very end, if you've set the new state for books via setBooks, why is the return elements of the page not rerendering? Why is a window reload required separately?
Hello! Really awesome tutorial! I understood everything, very well explained. I just wanted to know if it would be possible to have also delete method inside the edit route.
I meant... can you do a route.ts file for both methods, patch and delete?
I am using next auth to protect my api route handlers and i am using Google oauth strategy. But when I send fetch request from server components i get unauthorized but when i send same request from client component i got the result . Why is this happening?
great video, why do you filter the books if the page gets reloaded anyways? after the delete request
technically I think you are right. If the page reloads you shouldn't have to filter it. Good catch!
I keep getting a 500 status code(internal server error)when either posting or getting data from the db
And can’t really figure out where the issue is from
Can you show me the error code you are getting then?
how to display the old value of the book inside the input form when editing?
I've found a way, add setTitle(data.title); setDate(data.date); under setBook(data)
You should ddo the same also for server actions :)
yes I will look into server actions more but I think it's in alpha
What is really confused me is the typescript.. i prefer the jsx.
typescript is worth doing, I say just jump in and if you get stuck as chat gpt or overflow stack
@@brettwestwooddeveloper the reason why I find it difficult. It because I never give it a try ..
try it@@mrspecial3170
Forgot your password 😅 haven't uploaded any stuff.
Thanks for the sub!
i know this is minor but its prisma not prism
I know its Prisma, probably just my accent lol
@@brettwestwooddeveloper Your videos are very helpful!
Would love to see a bigger project tutorial using Next.js 13. Keep it up
Thank you - followed the entire video though. My only thought... window.location.reload() seems a really clunky way to reload using Next !?! What is the alternative, as when I remove it, it has another book ticked when setBooks(books.filter((book: Book) => book.id !== data.id))