🚨 *Important Updates* Starting December 15th, 2023, Grafbase won't continue its database service. The good news is, that even though we used Grafbase in the video, not much is changing. Most of the video content stays the same. If you're switching databases, check out these easy guides: - MongoDB: ec2-100-20-220-134.us-west-2.compute.amazonaws.com/x/d?c=37737646&l=34910189-259b-4997-a3fa-e0bf49175f82&r=edc3cf5c-a556-4379-9f6f-8d229fc83170 - Postgres ec2-100-20-220-134.us-west-2.compute.amazonaws.com/x/d?c=37737646&l=99920287-2a46-4dcb-a073-3863c6158dcc&r=edc3cf5c-a556-4379-9f6f-8d229fc83170 Setting up both connectors is easy. Most of the GraphQL queries in the video stay the same. Just a few tweaks based on your new database, and you're good to go. No big issues to worry about. This tutorial covers Next.js 13, but don't let that number fool you. Next.js 14 is essentially a performance update of v13. That means every concept, technique, and feature we dive into here is just as relevant in Next.js 14 Ultimate Next 14 Course is now live: jsmastery.pro/next14
Hi please can u make a small extension video or new video on how to integrate this with mongo instead of graph db... I am building mern apps using nextjs
BTW the bug causing upload error is not about using serverComponentsExternalPackages, i found the issue is that you should use NextRequest (not Request) as the type of request params for the upload post function, this will fix that directly
Back to Back 100% grounded tutorials all for free........GOD BLESS u endlessly for making my web development journey so much easy....i am ever grateful to u. Cant wait to Join the JSM family.....much love from NIGERIA
I greatly appreciate the effort you put into creating this tutorial. Thank you for providing the information I've been eagerly anticipating. Thumbs up for your valuable contribution!
This is really amazing. I've been watching your videos ever since the Messenger tutorial snd I've really improved my frontend skills but realised i still lack in other more technical aspects. I was wondering if maybe you could do an advanced tutorial on something like a figma clone or miro clone(id really like to know how to build a web app tool) like codux how does drag and drop ui turn into code, things like that.
That was an awesome tutorial. Great teachings. Looking forward to more hours on different and exciting things! The workflow was brilliant and the pacing was fenomenal. The introduction of the gist files for easy copy-paste really is a god-send not to deal with boring CSS repetitions. Definitely will recommend your channel.
You're one of my hero's. Thank you to you and your team for the content that's put out. Hope you have a blessed day/night, depending on where you're at.
Hey Adrian, been a fan of your work for quite some time ! And you're super consistent! May I humbly request you do more advanced best practices to do with DDD/Clean architecture , with Typescript? Thanks for all your hard work!
That's it! You are now the ultimate React learning resource in the WORLD!! No one can stop you ... could you pleeeeeeeease give us something on React Testing? The only thing missing on this channel ... 😍🤩😜
Hey there, appreciated your dedication towards your channel!! MAKE MORE TYPESCRIPT VIDEOS, SPECIALLY MIGRATED USERS FROM REACTJS TO NEXT TS. LOVE FROM INDIA 🇮🇳🇮🇳
come on guys, this video needs more like that it's get right now :( this video is amazing and teaches how to code nextjs, typescript properly even for a beginner like me. for me, it was easy to keep up and understand the materials taught inside it. Thanks Adrian!
I think that it would be helpful if you just show the docs of a tech (for example next auth docs). Many viewers don't know where you found a specific part of your code. Also, we will get better developers if you show us your way of learning things from the docs.
but that's exactly what they sell, they sell ebook that doing just that. so it's fair point i think for them to not explaining every api from docs because it is rather against their main business@@RonyEfendy
Hey Adrian, been a fan of your work for quite some time ! And you're super consistent! May I humbly request you do more advanced best practices to do with DDD/Clean architecture , with Typescript?
To resolve the problem of refreshing the page after create a project you can add a router.refresh() after the router.push('/'). I don't believe that is a best practise. But it works. A special tanks for the wonderful contents you are sharing. God bless you
For those who are having a hard time following: -Include latest grafbase as dependency at package.json of (grafbase folder) -Use connectors for postgres (neon) or mongodb. -Explore the pathfinder to get the endpoints within grafbase. -Also graphql variables issue (with after, last and others) within grafbase was fixed by cli version 0.71.2
Hold on a little bit, Adrian, I did't complete prevous Next JS 13 projects yet :-) Btw, TS usage is the next steps her to build perfect apps. Outstanding content. Like by default)
Hi bro the problem you mention at the last part of video which is next js 13 do not show post immediately It is due to caching in next js It can be fixed by using export const revalidate = 0; in the layout.tsx and page.tsx inside of app directory This statement means to cache nothing and fetch the latest data from server
Great content! I like this one more than the one before. I started coding with you after 30 minutes you published this. I could finish it within 3 days and you created it in 5 hours. You're great! I wonder if we can see a project which is deployed to hostinger?
Hi, Im Krish, Founder of Technolabdigitals from INDIA!! Your tutorials are pure coding gold! 🌟 I have a suggestion. How about creating a full tutorial series on building a MENN Stack Subscription Platform? 🚀🔥 From User Management to Content Control, User Roles to Payment Integration, and Admin Controls to User Authentication, your expertise in these areas is unmatched. And adding a touch of genius by locking content for free users would make it even more exciting! 💡💪 I can already imagine how your step-by-step approach and knack for simplifying complex concepts will make this tutorial series a developer's dream. Your creativity and attention to detail will shine through as you guide us through the entire process, from start to finish. Count me in as one of your eager subscribers eagerly waiting to dive into this MENN Stack masterpiece!
Your tutorials are amazing and unique. I love learning from your videos. It would be great if you could do a tutorial on how to build a Shopify website with next js integration.
Hi Adrian, I would like to see a build and deployment of a real estate project with the geo search/sort feature included. Combination of your real estate project+ Travel advisor+ admin dashboard and add in few features like An auction bidding feature for auction listed property. An admin dashboard to approve the client posted ad to go live only after screening. An option for the client to make a CRUD only for their profile. Image resize before saving to database; protect img from copying, screenshot or downloading by general viewers. A bit knowledge sharing on the SEO side using AI. Yeah, that's pretty much..!
Adrian, thank you so much for making yet another easy to follow tutorial. I'd be interested in seeing how to use Clerk + Firebase authentication, if that's okay.
Awesome video! Please upload a video tutorial on how to build an entire hospital management system with ambulence service, downloading patient report , contact with hospital authority these features in NEXT JS
🚨 *Important Updates*
Starting December 15th, 2023, Grafbase won't continue its database service. The good news is, that even though we used Grafbase in the video, not much is changing. Most of the video content stays the same.
If you're switching databases, check out these easy guides:
- MongoDB: ec2-100-20-220-134.us-west-2.compute.amazonaws.com/x/d?c=37737646&l=34910189-259b-4997-a3fa-e0bf49175f82&r=edc3cf5c-a556-4379-9f6f-8d229fc83170
- Postgres ec2-100-20-220-134.us-west-2.compute.amazonaws.com/x/d?c=37737646&l=99920287-2a46-4dcb-a073-3863c6158dcc&r=edc3cf5c-a556-4379-9f6f-8d229fc83170
Setting up both connectors is easy. Most of the GraphQL queries in the video stay the same. Just a few tweaks based on your new database, and you're good to go. No big issues to worry about.
This tutorial covers Next.js 13, but don't let that number fool you. Next.js 14 is essentially a performance update of v13. That means every concept, technique, and feature we dive into here is just as relevant in Next.js 14
Ultimate Next 14 Course is now live: jsmastery.pro/next14
yup got coming soon mail
Hi please can u make a small extension video or new video on how to integrate this with mongo instead of graph db... I am building mern apps using nextjs
I'm not getting :)
Hi one thing can u tell which Markdown editor is compatible with NextJs.
And thank you so much for this valuable project.
BTW the bug causing upload error is not about using serverComponentsExternalPackages, i found the issue is that you should use NextRequest (not Request) as the type of request params for the upload post function, this will fix that directly
Paused to take a moment to express my appreciation for your TypeScript videos - they are excellent!
Another masterpiece course for free, thanks for your contribution to the community
Much appreciated!
just finished the cars project today . was searching for more next +typescript stuff. you are just spot on
Enjoy! 😊
Back to Back 100% grounded tutorials all for free........GOD BLESS u endlessly for making my web development journey so much easy....i am ever grateful to u. Cant wait to Join the JSM family.....much love from NIGERIA
Love to Nigeria! 😊
Antonio and Adrian are top notch Croatian web devs
Definitely!
Was literally thinking about searching a NextJS 13 Crash Course. Here we are!
I greatly appreciate the effort you put into creating this tutorial. Thank you for providing the information I've been eagerly anticipating. Thumbs up for your valuable contribution!
bro how you finish this coure so fast
Thank you!
@@zzh315 consistency and focus shut down all social apps and 5 to 6 hour completed this course
So after 1 month I've finally deployed my project. Thanks, you're a great teacher, I've learned a lot.
This is really amazing. I've been watching your videos ever since the Messenger tutorial snd I've really improved my frontend skills but realised i still lack in other more technical aspects. I was wondering if maybe you could do an advanced tutorial on something like a figma clone or miro clone(id really like to know how to build a web app tool) like codux how does drag and drop ui turn into code, things like that.
Great idea!
ABSOLUTELY LOVED the debugging part at the end of the second hour. Very educative.
Iam waiting for your project my brother, Thank you so much, mark my words you're channel gonna hit 1 million under 1 month...
Thank you so much!
You are a GEM to this community.❤❤❤❤❤❤
Thank you so much! ❤️
I did it! Took me 3 days but its all worth it. Thank you ❤
Always bringing the best that’s out there, thanks!!
Appreciate it!
Just what I needed mate, love love love you
Enjoy! 😊
As usual, like, then watch... great stuff Adrian!
Great 👌
keep it up man, we always following your tutorial to be next mastering javascript! very awesome !
Thank you!
Your are the JS God ! ❤️Love u sir
Thank you! ❤️
That was an awesome tutorial. Great teachings. Looking forward to more hours on different and exciting things! The workflow was brilliant and the pacing was fenomenal. The introduction of the gist files for easy copy-paste really is a god-send not to deal with boring CSS repetitions. Definitely will recommend your channel.
You're one of my hero's. Thank you to you and your team for the content that's put out. Hope you have a blessed day/night, depending on where you're at.
Thank you! ❤️
Hey Adrian, been a fan of your work for quite some time ! And you're super consistent!
May I humbly request you do more advanced best practices to do with DDD/Clean architecture , with Typescript?
Thanks for all your hard work!
I wouldn't recommended that at all
That's it! You are now the ultimate React learning resource in the WORLD!! No one can stop you ... could you pleeeeeeeease give us something on React Testing? The only thing missing on this channel ... 😍🤩😜
Grew idea!
Thank you for another amazing project video, Adrian!
Appreciate it!
That ebook is the best. Thanks for all of this.
Hey there, appreciated your dedication towards your channel!!
MAKE MORE TYPESCRIPT VIDEOS, SPECIALLY MIGRATED USERS FROM REACTJS TO NEXT TS.
LOVE FROM INDIA 🇮🇳🇮🇳
Hey Adrian, been a fan of your work for quite some time ! And you're super consistent!
Back with another awesome project..Adrian Sir Thanks a lot
Appreciate it!
come on guys, this video needs more like that it's get right now :( this video is amazing and teaches how to code nextjs, typescript properly even for a beginner like me. for me, it was easy to keep up and understand the materials taught inside it.
Thanks Adrian!
I am curryenty learning web3 but, I can use this masterpiece to hone my web2 skills as well. Thank you very much.
Exactly! 😊
Awesome, as always! Thanks and keep it up. 😉
Thank you! 😊
After finishing promptopia,car showcase and 3D portfolio i cant wait to start this!!!
Amazing!!
Very nice course, showing some great tips along the way, thanks!
This project is a very slick way to showcase a lot of your other projects
This one is special ❤Thanks
It is! ❤
amazing , as always 😊😊
Thank you so much 😀
I will be glad to see your typescript video too. Great explanation.
Your video is gold in this era
Thank you so much!
Great course! thank you
yes, more Typescript project with nextjs💯💯💯 Thank you and your team!!
Thanks for contributing another masterstroke project for us. I think this project helps us for learning the Next.js 🙏🙏🙏🙏❤❤
I think that it would be helpful if you just show the docs of a tech (for example next auth docs). Many viewers don't know where you found a specific part of your code. Also, we will get better developers if you show us your way of learning things from the docs.
Thats exactly what I'm looking for.
but that's exactly what they sell, they sell ebook that doing just that. so it's fair point i think for them to not explaining every api from docs because it is rather against their main business@@RonyEfendy
I wanted to see if I had missed a video and bam! there is a new video lmao
Keep it up i love your content !
Definitely not, here it is!
Awesome project as always 🔥
Mr Hi there 👋.Your Projects are beyond special
Thank you! :)
I appreciate your effort on this tutorial. Professional and punctual.
Great as always 🎉🎉🎉
🎉👋
چراق طبثه ۱۶ با مهمان های مشتی اش همچنان روشنه ❤
مرسی 🙏
Hey Adrian, been a fan of your work for quite some time ! And you're super consistent!
May I humbly request you do more advanced best practices to do with DDD/Clean architecture , with Typescript?
yes really we need this !
yeah we would love to get more typescript videos from you
Thanks a lot for everything Adrian!!!!!
Thank you!
To resolve the problem of refreshing the page after create a project you can add a router.refresh() after the router.push('/'). I don't believe that is a best practise. But it works. A special tanks for the wonderful contents you are sharing. God bless you
Where exactly add it in a backend?
revalidateTag in nextjs
The best mern stack projects are here 🎉
Thank you very much ❤
Awesome! Thank you so much! 🙌
Glad you like it!
a typescript pro course will be bliss
Thankyou so much for such a masterPiece video
Thanks!
As always wonderful content, Thank you much.
Thanks!
For those who are having a hard time following:
-Include latest grafbase as dependency at package.json of (grafbase folder)
-Use connectors for postgres (neon) or mongodb.
-Explore the pathfinder to get the endpoints within grafbase.
-Also graphql variables issue (with after, last and others) within grafbase was fixed by cli version 0.71.2
New project to grow my typescript skills 😊 thank you Adrian
You're so welcome!
Hold on a little bit, Adrian, I did't complete prevous Next JS 13 projects yet :-) Btw, TS usage is the next steps her to build perfect apps. Outstanding content. Like by default)
Thank you! 😊
So much excited to learn more from you.
Awesome!
Adrian! you are the best on UA-cam !!!
Thanks man that was so helpful ❤❤❤
Hi bro the problem you mention at the last part of video which is next js 13 do not show post immediately
It is due to caching in next js
It can be fixed by using
export const revalidate = 0;
in the layout.tsx and page.tsx inside of app directory
This statement means to cache nothing and fetch the latest data from server
thanks for new lecture !! 🎉🎉
🎉👋
Thanks for this. This with MUI would be the best project ever!!!
So blessed that I find your channel
You really save all broke students around the world 😂
Thank you for sharing ❤
Great content! I like this one more than the one before. I started coding with you after 30 minutes you published this. I could finish it within 3 days and you created it in 5 hours. You're great!
I wonder if we can see a project which is deployed to hostinger?
Can you tell me about this project?
Hello there!
Let me add my extra features and impress da ladies, thanks JS. No JavaScript channel that's better than this one love from Nigeria:)
Thank you so much. Love to Nigeria!
thank you for the video😁
Hi, Im Krish, Founder of Technolabdigitals from INDIA!!
Your tutorials are pure coding gold! 🌟 I have a suggestion. How about creating a full tutorial series on building a MENN Stack Subscription Platform? 🚀🔥
From User Management to Content Control, User Roles to Payment Integration, and Admin Controls to User Authentication, your expertise in these areas is unmatched. And adding a touch of genius by locking content for free users would make it even more exciting! 💡💪
I can already imagine how your step-by-step approach and knack for simplifying complex concepts will make this tutorial series a developer's dream. Your creativity and attention to detail will shine through as you guide us through the entire process, from start to finish.
Count me in as one of your eager subscribers eagerly waiting to dive into this MENN Stack masterpiece!
Excellent Video. Keep up the good work👍🏼
yet another great build🥰🥰😍😍
Appreciate it! 😊
Your tutorials are amazing and unique. I love learning from your videos.
It would be great if you could do a tutorial on how to build a Shopify website with next js integration.
yes absolutely
More typescript please :) your awesome!!
This is Awesome...Im sure i'll get a job after this
Thanks!
Thank you so much for the video
Thank you!
Hi Adrian, I would like to see a build and deployment of a real estate project with the geo search/sort feature included. Combination of your real estate project+ Travel advisor+ admin dashboard and add in few features like An auction bidding feature for auction listed property. An admin dashboard to approve the client posted ad to go live only after screening. An option for the client to make a CRUD only for their profile. Image resize before saving to database; protect img from copying, screenshot or downloading by general viewers. A bit knowledge sharing on the SEO side using AI. Yeah, that's pretty much..!
Thanks for the turorial, its such a masterpiece course for free. I hope you can make a tutorial about tRPC in NEXT js.
Hi There 👋
Hey
Awesome content! I'd appreciate more Typescript videos. I'm new to it.
😎 I am learning to create something similar to this as always an amazing tutorial Adrian 👍✅
Cool, thanks
@@javascriptmasteryplease can u post on discord how to use mongo for this
Awsome 🎉. Thanks for sharing your knowledge !
Merci Beaucoup 👏🏻🦾
Merci!
In 9 mins i can't even write great course.. But will be fun to do the whole course.. Very excited 🤩
Thank you!
More typescript please! thank you
Out class project and lecture and brief deeply .🥰
Great Project, as always
Appreciate it!
Sir I'm starting making this website and will show to my university teacher as a final year project. 😂
Thanks Adrian. yes please, Use clerk in one of your next videos please.
Big love for you sir ❤❤❤
❤️
Hey Adrian! Greate tutorial! In order to update the page without reloading, I would recommend using Apollo Client with the update cache method
Enjoying the video. do a full typescript crash course. thank you
This is really amazing.thx.
Adrian, thank you so much for making yet another easy to follow tutorial.
I'd be interested in seeing how to use Clerk + Firebase authentication, if that's okay.
A typescript crash course would do the trick yes!
@Javastmastery whats with the fake profiles
Hey Adrian, in 1:49 you used a site to check responsiveness in multiple devices, What was it?
Thanks a lot for ur effort
Thanks!
Can't wait to try this one, hey bring back pleeeeease that live about finding job please
👌
Awesome video! Please upload a video tutorial on how to build an entire hospital management system with ambulence service, downloading patient report , contact with hospital authority these features in NEXT JS
Great idea!
ill love more typescript videos