Next.js 14 Full Course 2024 | Build and Deploy a Full Stack App Using the Official React Framework

If you want to truly master the most modern Next.js, check out: www.jsmastery.pro/next14 🔥

1:21:46 For those who is stuck on the Google Authorized domain part, just click the trash and keep it untouched. I don't think it accepts local dev domain.

Man this is my first contact with nextjs and I have to say that I loved it.
You are so didactic and managed to explain all of that in just a couple of hours.

thank you for the amazing work, it's so so organised, and the way how you switch between the NextJs pillars it's really insane, thanks again for the hard work!

Man! You have NO IDEA how much your content helps a student like me who can not afford expensive courses. Please keep up providing such AMAZING quality content. You are a true hero.

Honestly, the first ~45 minutes (crash course part of the video) is worth $50 to me. Excellent work!

Man I have to say, the production value of this video is extremely high. Especially the description of the benefits of Nextjs was the best I have seen (and I looked quite a bit) and convinced me of using it for my next project. I thought I may over engineer my project or make using a dedicated backend more complicated but turns out I worried too much. Thanks for the efforts!

Great tutorial. [31:22] if you are using typescript, you may need to pass the postId to your component as params e.g const page = ({params: {params: {postId: number}}) => {return {params.postId}}

As a self taught Beginner developer, I really appreciate the hard work you're putting in these amazing tutorials. HANDS UP 🤲JSM. I hope more NextJS 13 in the future.

So far the most complete, interactive and packed course ever.
Not 40hrs, 90hr course like other platform do

This is the best Next JS course I've taken so far. Bless you brother for this incredible work

Thank you for zooming in on the screen; it makes easier to watch on my phone while keeping the code readable.

I have just started learning nextjs, and you came up like blessing. Thanks a ton. Having high expectations with this one

I would love a tailwind crash course!! These videos are amazing and they're the only ones I can actually sit down and watch for 3 hours without getting bored. I learn more in this than in a week of school 👌

How calmly you explain everything. Amazing teaching!

Undoubtedly, the best Next.js tutorial on KRplus. Thank you, and keep up the amazing work!!!

Once again a great tutorial from the master. Eagerly waiting for the Tailwind CSS one. Thanks Adrian, for all the quality content.

Amazing Tutorial Adrian, Love what you do for the community, I coded along till the end, learnt a lot, and will still use it as a reference for further projects. Thank you

Thanks for creating such a clear and concise course! The explanations are clear and easy to follow. This is by far the best course I have come across on youtube

I just wanted to express my sincere appreciation for the amazing tutorial content you've been providing on your channel. The way you explain complex concepts and guide viewers through practical examples is truly commendable. I've learned so much from your tutorials, and they have greatly helped me enhance my web development skills.

dude this is perfect timing, i was literally just about to start practicing next and looking for videos yesterday, and today you upload this!! thanks man ❤ appreciate the free content so much

You did't say "Hello There"❤😂

What a great video! A got a bit frustrated when I saw no Typescript but I've watched until the end and I've finally been able to understand lots of concepts. Thank you!

It was my first use of route handlers and auth of Next and MongoDb. Thank you so much for teaching me all of this stuff and giving me the curiosity driving me to dive deep into them !

Perfect timing!
I really need this. Thank you so much, appreciate it!

Wow, this Next.js 13 course is hands down the best resource I've found for mastering the latest features of the official React framework! The pace, clarity, and depth of the content are just perfect, making it easy for beginners to follow along, while providing valuable insights for more experienced developers as well. I appreciate the way the instructor breaks down complex concepts into simple, digestible steps, and the practical examples really bring everything to life.

Thank you so much for creating this detailed awesome tutorial.
There's not enough quality hands-on resources out there on NextJs after the major update.
I really appreciate it!
Also waiting for the ebook. Thanks again.

"Fantastic as usual, I look forward to additional full-stack projects beyond the next 13 in the future. Your hard work is much appreciated. You are a lifesaver." ❤

This is by far the best tutorial I've found on KRplus. You are a life saver; I must confess. Illustrative, explanations clear as rain with great accent. Thank You! 🙏 Kindly make a crash course video on Tailwind CSS - I'm voting for this ❤

First 43 mins of video is better than most udemy 30-50 hours long courses. Great job!
Btw, as the one who is looking for a Tailwind course, i would highly appreciate if you make a Tailwind crash course.

The most complete and detailed tutorial about next js .. thanks mate.

Every time I see a new tutorial from you I get excited. Please know that your work is helping developers in Kenya improve their skills. Thank you

A small heads up while setting up dynamic routing based on postId, as shown at 28:33 (according to the latest NextJS 13.5.4)
You'll have to use useParams() from "next/navigation" and get the postId instead of directly writing {postId}.
A small example would be:
"use client"
import React from "react";
import { useParams } from 'next/navigation'
export default function PostWithId() {
const params = useParams();
return Post Page with ID: {params.postId};
}

First of all a big thank you for these kind of videos, it is nothing but a blessing. Just a suggestion if i may :- as many of us are already done with the basics, i think it would be great moving onto something which is bigger like a series in which there is usage of Typescript, microservices, unit testing, integration of firebase or aws for a wide range of reach. Hope i am making any sense.😛

This is awesome! I just started learning nextjs and you bring this! So cool man! worth every second. Thank You So Much! I'm so grateful to you! Did you release any next-auth tutorial? It'd be easiest for me to learn!

I have just started learning nextjs, and you came up with a blessing, easy explanation learned a lot from this course As always. Thanks, Adrian.

As always, amazing content, structure, and awesome teaching style! I would love to see a full crash-course on tailwinds features and their usage. Please and thanks!
Very much considering JSM Masterclass experience.
If I could get it 50% off and 6 month payments Id jump on it in a heartbeat.

Home Page part is unbearably complex and confusing but the rest is so regular/simple so that ones wouldn't forget easily. Thanks for another great video man. Cheers!

Nice an practical. Also relaxing to listen to and watch - not like other tutorials that are rambling, rushing, stressing me out.

This is exaclty what I needed to get up and running with Next.js. The tutorial is concise and hands on.

Time Stamps
28:00 Routing using postId, layout, loading, error
31:50 Data Fetching(SSR, SSG, ISR)

Crystal clear and easy explanation learnt a lot from this course As always.
Thanks!

A tutorial on tailwind css would be awesome. Thanks Adrian 🙌🏽

Thank you for such a great practice!! I would love a tailwind crash course too!!

Awesome tutorial. have you considered doing some typescript projects? it would be nice to include type safety in these projects since it's pretty much industry standard at this point.

This channel is pure gold! Thanks for all your work!

You are the best - such a great tutorial. main thing
Being your voice. It's totally clear to understand and your ability to explain any subject is also great.

Adrian, thanks for all that yo do for us, I get a job based on your videos and I'm very thankful to you.
Now to enjoy, once again, you amazing NextJS content.
Again thank u so much❤️❤️

just in case you have problems with adding authorized domains, notice that he removed that part without saying he did, so dont add any authorized domains in Ouath

i've done next js development 3 years ago. im not much of a front end guy right now. I am having chills on how this project evolves.

What a clean and efficient way to teach. Loved it.

Adrean you are my inspiration.
I wish I have opportunity meet you personally to tell how much i am grateful for all the things I've been learned from you.
In each video when i hear to you voice i feel so confident

I finished the course in 5 days but with following properly and exploring other things too! Glad I didn't gave up and left it in between. Thanks bro for teaching me NEXT.JS in the best way possible

Thank you so much for this course. It was amazing. I was trying to learn Next.js before by reading the documentation and not going to lie I have fully read it but didn't manage to write anything because it was too hard even though I learned all its concepts. This video provided me with the practical knowledge that was missing. Again, thanks a lot!

The back and forth between the fundamentals and the Next.js version is so helpful for my understanding.

Hi. Great courses. Thank you. Please add a tailwind css course, too. specially suitable for people who are not experts at css. Other tailwind css courses on youtube seem to be very difficult and need total expertise at css.
It'd be very appreciated if you create a balanced course on that so everyone can use it in their projects.

Hence proved, you've mind reading abilities, I was searching for Next 13 Projects on YT yesterday, and you posted it today!!! ❤❤

Thank you so much brother for this tutorial and the tailwind introduction ebook also !
Informative, to the point and aesthetic

Thank you for the video. As a side note, the reason you had to re-run the project to see the changes was that the Profile page was imported with a lowercase "p" instead of an uppercase one. It's strange that it didn't throw any errors, but that's why your changes weren't applied until you re-ran the project.

Become one of the first 1000 people to get the Next.js 13 premium eBook for free - resource.jsmastery.pro/nextjs-guide 🎉

Yes, please create a course for tailwinds!
Although I know TailWind is the short cut of pure CSS. But it becomes confusing if I want to build more complex components like those in MUI

Amazing teaching and very greatful to have found your channel! Looking forward to see that Tailwindcss crash course! 🎉

Thank you. You are the best, your proyects and videos have helped me so much!

Sir I've been recently watching and learning from your channel and your channel is one of the best channel for learning web development...thank you sir for making these amazing content for us....❤❤❤❤❤❤❤❤

Adrihan You are so Helpful I was always wanting to Learn Next.Js but did not find the right course but you did it you are a chad bro. Hope Some Day You are gonna Post vue js but first Tailwind I know Tailwind Most of the part but you know it is never wrong to have more knowledge course also best of luck 🥂🥂

You made it straightforward, I appreciate your efforts. I hope you will do a video course about tailwindcss with modern project.

You are great at explaining difficult stuff. Thanks

this is great, but yes, a tailwind tutorial would be amazing

This man helps developers around the world and he will go to heaven for this.

Just finished, thank you so much!

The efforts you put in these videos are really worth appreciating ❤❤

Adrian thank you so much - the last 6 months of your guides have been more helpful to me than the previous 2 years of tutorial hell I was in 🙏
One suggestion if I may - for those of us who have watched enough of your tutorials to now have acquired a comfortable grasp on the basics, I think it would be superb if you could make additional tutorials featuring Typescript over vanilla JavaScript instead (as that's where the industry is heading too). And also if you could bring up things like Unit Testing and Storybook instead, since these are used widely in the industry but tend to be neglected in personal projects!

Small bug when saving a new user (around 1:35:40), you defined that 8-20 character constraint on a username, but are deriving it from the user's actual name. This would fail for people with really long names, such as a Thai friend of mine, whose last name is "Sriwatthanathienpong" which is exactly 20 characters, but their first name would cause that check to fail, and their account would not be persisted. Now, I know this is not an actual app and for education, but this is for the benefit of future viewers to know.

Thank you so much for this tutorial! I learned a lot✨

Great video and tutorial. I just needed to refresh my knowledge of what is happening in the world of Next.js, precisely because of further improvements. Nice sample app. Thanks 🚀!

Please adrian give us more content on next js. I too feel that next js will bring more jobs. Anyways you are god!!! ❤❤

Access blocked : Authoristation error is showing at 1:45:20 Please reply to his message and slove this error.
Like the comment guys, if you are facing the same.

This is by far the best Next.Js tutorial as of 2023.

Outstanding content!, project touched on enough for me to dig into the docs and really get a grasp of this powerful tool

Thanks, i did my portfolio with your tutorial and got a job, now im working as fullstack using next + amplify ui, easier stack

Fantastic tutorial - thank you so much. Only issue I had was when I deployed it to Vercel - the Feed page no longer updates after new posts are added - weird. It works fine on localhost. Any thoughts?
Anyway - thanks again. Great work.

the best nextjs course i have come across. Thank you so much!

I just love how your design look like thank you for also taking care of the look of the webpage.

Please create a video on Tailwindcss where you take a design from Figma and convert it to code.

I am new to next.js , As a self taught developer, I really appreciate the hard work you are doing for the community ! I am getting an 403 error while trying to log in. It was working fine before but after 1:48:00, I am facing this error.

43:00 the preview of the project that will be built , awesome and clear explanation

Thanks so much Adrian, we're really grateful for ur premium level free courses
Thanks once again
Looking forward for T3 stack projects course

Great tutorial. This was very helpful in understanding how Nextjs13 works. I have added a new functionality where openai will create an optimized detail prompt for every user prompt and add it to the database. However i realized the feed works well on local build but doest not fetch the latest data when deployed on vercel. I believe is has something to do with caching. I have added cache: 'no-store' object to fetch but this doesnt work. Anyone has faced similar issue or know a fix?

Hey Adrian, another great video from a great person, thank you so much.
I would be grateful if you could create a video about Next.js 13.4 and Redux Toolkit, explaining how to use them togather.
Thank you again.

I am enjoying it! Thanks 🙌🏾

1:21:25 - what was the problem with adding domain address, you just skipped it and it works ?

1h 43 minutes into the tutorial... AMAZING! so far. Very clear, easy to follow and completely understandable and applicable to any other project.

1:48:12 From the point in the video where you corrected the route.js file to add callbacks object and cut the session and signIn into callbacks, I am getting the error *Access Denied - You do not have permission to sign in* . When I check my mongodb, I didn't find the share_prompt database as well..
What could be the problem?
P.S.-- I checked with the MONGODB_URI password.

i don't know if you read this, but I've learned so much from you. i've been using next js for over a year now but you've managed to make the crash course interesting that i've watched it again. THIS IS AMAZING. but if i can make one request can you make a video on t3 stack form beginners and also a t3 stack with Expo for mobile app? it would be an amazing Course. THANKS

hey Adrian, I loved watching and coding along with your web dev projects. I really liked this course on Next.js , keep doing such good work bro. Thanks a lot again😇😇

1:47:48 When I follow the step and put the two async function inside callbacks, it shows access denied when I tried to login, but before this step I was able to login, anyone know about the reason?
Anyway, it is an amazing tutorial! I wish I could have known about this channel early!

at @1:45:23 I can't see the sign in button. Not able to perform the next steps. Anyone has a solution?

Your'e one of best teacher in the world. Simple and well explanatory...so easy for anyone to catch up in learning. Thanks a bunch for all you do.

Such a fantastic explanation! Thank you

Yes a full crash course on tailwind would be great 🙏.