Next.js 15 Crash Course | Build and Deploy a Production-Ready Full Stack App

[@javascriptmastery]

🌟Ultimate Next.js 15 Course is now on SALE - jsmastery.pro/next15

[@parasagarwal5701]

Hello Sir, I want to buy your course on Next.js but I can't afford a course more than 500 INR rupees , can you make a course under 500 rupees or some how bring down the price of the course. Thank you

[@etaitsur]

Thanks a lot for all your hard work and dedication! I love your content and was getting ready to purchase the course but the sale is over.. Can you please reinstate the sale?Thanks 🙏😅

[@jeanlambertniyigaba439]

How can I solve the issue of incompatibility of markdown-it with reatc-dom 19, without deleting package-lock and node_modules? Here is the error I ma facing: $ npm install markdown-it npm error Unable to resolve reference $react-dom

[@ScenesAdda_]

Discount ?

[@satishkoya2309]

@@parasagarwal5701 you want him to change the price from 51,152.40 inr to 500 inr?

[@oneilobi822]

Noticed the Theory explanations didn't have breakdown on timestamps so i did this incase you want to come back to a particular explanation 👇. 0:00 → Intro 06:26 → Architecture 07:05 → Rendering 08:12 → Routing 08:39 → Evolution of nextjs 10:53 → Installation 11:56 → Folder structure work through 17:00 → Server component 19:35 → Client component 21:04 → Server side pre-rendering 23:10 → Routing 24:20 → Nested Route 25:50 → Dynamic route 27:17 → Links 28:24 → Extracting different information from the params obj 30:15 → Layout 31:33 → Route Groups 36:45 → Error handling 39:32 → Loading UI 41:02 → Data Fetching 47:17 → Server side strategies 48:00 → Static site generation (SSG) 48:42 → Incremental static regenegation (ISR) 51:06 → server side Rendering (SSR) 52:10 → Partial Pre-Rendering (PPR) 53:00 → backend 55:00 → api 57:26 → Search Engine optimization (SEO)

[@rupesh617]

Wow, you’re incredibly fast! Next.js 15 just launched, and you already have a full course up on it. Huge respect, sir! 👏 Thank you for keeping us up to date with the latest tech!

[@javascriptmastery]

Working on it!

[@varungaurvarungaur9108]

bro can i blv on it

[@georgejere2306]

Your 3D dev portifolio helped me land a job, god bless your amazing work Adrian

[@luffy5775]

how can you explain

[@javascriptmastery]

I'm super happy to hear that! :)

[@xenos112]

Feels like a lie, web dev is more then using two libs to import a 3d design in your website​@@luffy5775

[@codingwave56]

How is it possible!!!!

[@georgejere2306]

@@luffy5775 explain what

[@knowwow6638]

I just stuck during building my project using Next js 15 and I open youtube for learn what all updates are in 15 version guess what I saw your video, I click on it without wasting more time! Thank you!💖💖💖💖

[@javascriptmastery]

Enjoy! 💖

[@Dach980]

Hi everyone. I was doing the course and firstly, thank you so much, I decided to learn Next.Js and the video is more than I expected. Secondly, I had some difficulties when trying to use unstable_after with Next version 15.1.1. It's not experimental anymore, it's official and you can call it directly without adding next.config.ts file (I mean it's set to true by default now). These are the lines I used: import { after } from 'next/server'; ... after(async () => await writeClient .patch(id) .set({ views: totalViews + 1 }) .commit() ); And it works. Hope it works for you too.

[@anhanhnguyen3108]

daymn thanks i'm having this issue too your solution works

[@tiger_io]

I got this vid as an ad, i was like why is the full ad 5 hours long i wont skip let me see what this is, the editing was amazing and the main idea of the video pulled me in, I'm now interested to see all 5 hours because I'm sure ill enjoy it with all the graphics in editing of this video, well done 👏

[@rezvlt9285]

I've learnt so much about NextJS in the first hour alone. This video is as good as gold!

[@Matos-s2s]

Thanks!

[@sam_dare]

You're making Nextjs Super easy to work with. I was checking out your tutorials when this came drop. I can't wait to buy your course.

[@javascriptmastery]

Awesome, thank you!

[@Ektaverma5040]

Hello sir reply me

[@mdalmamunit427]

OMG! You're faster than anyone. I even thought that I would make a full-stack tutorial using next 15😅

[@javascriptmastery]

Haha here you go! 😊

[@Strochkin]

🤣

[@isaacadam255]

My GOAT in my coding journey. Adrian you are the best. Holla from Tanzania

[@javascriptmastery]

Thank you!

[@gilbertmunuotz]

wabongo tupo vizuri kwa kwelii😅😂😂

[@arjunsharma9676]

hey bro, I made a hacky full stack React app before this to understand how it works, Next js simplifies component and API creation so much, finished this app in 3 days end to end. Thanks for your hard work

[@surafelzewdu7191]

Hey man I wanted to learn next.js, should i start with this tutorial or should i learn react first as a prerequisite. If it matters I have good experience with vue.js and node.js(express)

[@saeedahmed1177]

Learn basics of react first at least because it has some hooks which are nessecary like useefect use ref etc​@@surafelzewdu7191

[@johnuelmangaba4123]

Glad that you hit that 1M! just got back from doing my thing, and back to coding, and my favorite channel already hit their 1M!

[@javascriptmastery]

Keep up the great work!

[@unrinconlatino]

Thank you! The app works; I just need to have patience. I would suggest explaining concepts in greater detail. You're so advanced that it's challenging for me to code along and grasp the material simultaneously. You go so fast that if you could pause for a second or two longer before switching screens, it would be really helpful. Thanks again!

[@javascriptmastery]

Great suggestion! I go much slower within the ultimate course

[@modeman6387]

I just finished deploying to vercel. Thank you so much for this amazing video!

[@OPGAMER.]

Still remember when I watched your Next.js 14 crash course. Time flies so fast.

[@javascriptmastery]

Yes, you always comment! ❤️

[@shivanshsharma4916]

you got a job op gamer ?

[@OPGAMER.]

@@shivanshsharma4916 I do freelancing.

[@timotiusanrez9492]

This probably the most understandable nextjs tutorial that I have ever watched. Good work

[@beefcakees]

I also liked your use of graphs to explain what we just did! Great for us right side dominant

[@javascriptmastery]

Glad you enjoyed it!

[@kevinndanyi498]

Those intro animations keep me glued😅😅 especially the groundbreaking clip 0:29 😂😂😂. I love your sense of humor. Anyway let me continue learning the great stuff. Your videos are top notch👏👏👏

[@BugCode420]

Hi Adrian Hardin, I always follow your videos, which are so impressive, and I always suggest them to my junior teammates and my well-wishers. Thanks for uploading new things for us.

[@javascriptmastery]

Thank you for the kind words!

[@abbasikoders-academy]

Wow, you’re incredibly fast! Next.js 15 just launched & I waited when you upload a new course on these Update & you already have a full course up on it. Huge respect, sir! 👏 Thank you for keeping us up to date with the latest tech!

[@javascriptmastery]

My pleasure!

[@BahaaAldein10]

I've been waiting for this amazing course! You are my hero!

[@javascriptmastery]

Wow, thanks!

[@enes5509]

Landed an internship two weeks ago, thank you Adrian!

[@javascriptmastery]

Fantastic!

[@Aitech885]

Have degree?

[@enes5509]

@@Aitech885 Not yet (2nd year comp sci student)

[@surafelzewdu7191]

Hey man I wanted to learn next.js, should i start with this tutorial or should i learn react first as a prerequisite. If it matters I have good experience with vue.js and node.js(express)

[@javascriptmastery]

@@surafelzewdu7191 React first

[@sahilkumar12]

You are so fast, within 3 days u created the full tutorial. It's so beneficial for me. Thanks a lot ❤

[@javascriptmastery]

You're welcome 😊

[@cindia9703]

All the best for 1 million subscriber, soon!!! You deserve it.

[@javascriptmastery]

Thank you so much 😀

[@Technet-00]

I was watching Your Next JS 13 course when I saw your comment. And Now I am here . Thanks!

[@biswajitswain4845]

Need more videos on different authentication, Role based, middleware setup. This is very much crucial in the modern application.

[@OscarM003]

Wonderful. Thanks a lot, Adrian. Your videos give more than just the main thing. I clicked to learn next.js, but have discovered sanity, something I will be using in my next project. There is also a lot I have gained other than sanity. This channel is something I never knew I needed till I found it.

[@javascriptmastery]

Great to hear!

[@GhostWithAHoodie]

Mr Adrian, what you do has had so much impact in my life that i dont even know how to describe this feeling. We love your work, We love you, thanks for everything. Sorry if i wrote something wrong, im still learning english kkkk

[@javascriptmastery]

Wow, thank you! My pleasure

[@squarerootof2]

Yes, you wrote one K too many.

[@GhostWithAHoodie]

@@squarerootof2 Oh my, thanks

[@molaraiche]

your energy in coding is Very motivating. whenever i felt down adrian i back to this channel hehe just introduction light a fire. being a part of the JSM pro community is one of my best investements in my career. highly recommanded guys. not only NEXT.JS course but a way to think as a developer and act like one. keep it up ! 🔥

[@javascriptmastery]

Amazing, keep it up! 👌

[@Khamzat_07]

This One is Pretty Dope ! Keep it up bro !🥰🥰🥰🥰

[@javascriptmastery]

Thanks 🔥

[@curiouskarstien]

I love the new style of intro in these newer videos with gifs 👏👏

[@javascriptmastery]

Thanks! 😊 🙌

[@markthepianist6577]

_somebody_ got inspired by fireship

[@rashidshahriar7913]

Really can not ask more from you. But I bought the next js 14 course I think right now I can not offroad another course. But thank you.

[@javascriptmastery]

You get the upgrade for free if you bought the previous version! :)

[@signalsensei]

wow you won our heart! most needed video ever right now!

[@javascriptmastery]

That's the goal! :)

[@ahsankabir6810]

I'll be buying your course within a week. You're an inspiration for me. God bless you, Adrian.

[@javascriptmastery]

Don't miss on the launch sale! :)

[@OluwatayoDamiloladavidCy-mo4ig]

Your work is a masterpiece. Because of your videos, I am always up to date on NextJs. I wish I could afford the master class course. 😩

[@javascriptmastery]

Wow, thanks!

[@AhmedLukman-e6z]

Hey, which extension did you use to indicate what parameter value to be passed? Edit: Also, a point to note, I believe the .heading class at 1:37:48 should be placed in component layer directive and not utility layer. This is because components layer is for reusable component patterns like your .heading class that combine multiple utilities while utilities layer is for single-purpose utility classes.

[@javascriptmastery]

I used WebStorm IDE

[@nguyenngocyennga]

Wow, I was actually able to finish the whole thing to the end. Great work, thank you!

[@ÇlirimKrasniqi-s7f]

I'm having problems when I try to sign in with github at 1:25:03 on the video, its not working as it should, its not opening github authorization part its trying but failing

[@asish_sabu]

Same issue

[@Lohithurfrnd]

Any solution?

[@cosminpavel6231]

@@Lohithurfrnd u can check to import the sing in and sign out from @/auth not next-auth/react, that solved for me

[@wirekobrobbey4771]

can you give more details on the issue you're facing ?

[@MdEmon-eu8oo]

{ "use server"; await signIn("github"); }} > Login

[@tech_xeniex]

Amazing work Adrian, All your react js tutorials make me a confident front-end developer, looking for a future of Node Js with you.🤩

[@javascriptmastery]

You're very welcome!

[@yuggupta831]

a error shows in installing markdown package .Unable to resolve reference $react-dom

[@its_prabha]

Instead add the same of react-dom below in dependencies

[@GanoMagno]

@@its_prabha I don't understand. What do you mean? Can you clarify please?

[@GanoMagno]

Same issue. Did you fix it?

[@its_prabha]

@GanoMagno yes

[@its_prabha]

Just copy actual version in package of next, reac, react-dom and paste in the under package-manager

[@mominnaveed2095]

The best parts of this tutorial were nextAuth or Auth.js parts which were very helpful, I had a lot of issues implementing authentication with NextAuth in the past! Thank you and wish you best of luck for future! subscribed!!!

[@omerturkoglu7002]

Can I learn next.js before learning react or should I start with React?

[@alexturner29]

Generally you should start with react

[@vlc-cosplayer]

100% learn the basics of React, then come back to Next (Next is an abstraction on top of React, which is already an abstraction on top of vanilla JS)

[@nasko235679]

While nextJS is great in terms of providing easy routing and data fetching directly from server components, where it becomes more difficult is adding micro-services like a web socket server without relying on paid services. It would be great if in the next video you explore things such as creating and connecting to an external web socket server , or webRTC because I have found that a lot of new nextJS devs rely on paid services for auth, web sockets and database waaay too much. Fantastic video 👍

[@javascriptmastery]

Thank you, great points!

[@jamesg3419]

when i try to go to /studio i get the error - Error: Missing environment variable: NEXT_PUBLIC_SANITY_DATASET

[@RanGePACKAGINGDESIGNS]

register the NEXT_PUBLIC_SANITY_DATASET="xxxxxxxxx" and the NEXT_PUBLIC_SANITY_PROJECT_ID="xxxxxxxxx" in the root(main) env file. In video he did not show that but its very important.

[@RanGePACKAGINGDESIGNS]

feel free to let me know if worked out.

[@kennethnwankpa8670]

I will try this...thank you​@@RanGePACKAGINGDESIGNS

[@kennethnwankpa8670]

Please what should be in the xxxxx?​@@RanGePACKAGINGDESIGNS

[@shivanshsharma4916]

This website is BEAUTIFUL ! its so new and fresh in terms of its looks ❤

[@javascriptmastery]

Thank you, that was the goal!

[@BrutalInsights]

Loving the Next.js courses and projects by the JSM team! You all are amazing and thanks for also including deployment steps which is critical with any project. Please keep up the great works!

[@javascriptmastery]

More to come!

[@fmschool1]

39:15 By the way, global-error.tsx won't activate in development mode. You have make a production build using npm run build && npm run start. That way you can actually see the global-error.tsx in action.

[@kaeridota5580]

Wow thank you so much for the ebook, I really appreciate it. I couldn't afford to buy since I live in a developing country, but I'm super interested in learning more about NextJs. Thank you once again 😭😭

[@javascriptmastery]

No peoblem! 😊

[@iLiran]

Too slow, Next 16 is just around the corner.

[@shivam7429]

Bruhh 🤦🏻‍♂️

[@javascriptmastery]

Haha :D

[@zocky3282]

😂😂

[@amitavasengupta5580]

Using Next 125 already

[@codingwave56]

Using Next 69 already 🤌

[@beefcakees]

I must say. I do prefer this new method of showing the code in a slide snd talking about it rather than typing and talking about it. Makes it harder to digest. But when i can see the whole thing, type it out, think about ehats being achieved with it, and then have youe explain it. Much mor stress free and a lot less back and forth. Pls concider doing this more. For example, when you are talking about how to folder structure api calls and how to set up the page.ts files. 👌🏻👌🏻🔥🔥🎉🎉🥰🙌🏻

[@javascriptmastery]

Thank you, more to come! :)

[@AdamGweleg]

Thanks❤ , hope next time show us how we handle authentication and how to handle JWT tokens

[@javascriptmastery]

Not next time, I show it to you this time! :)

[@ginthozan]

You are doing great man! Expecting a testing tutorial from you like Jest, Selenium or Cypress

[@AJINCRaju]

I know nothing about Next.js. Can I wathc this?

[@kunal.d]

Sure! If you are familiar with react.js

[@kunal.d]

Thanks for the great content brother❤

[@rupdas4991]

Bro can you teach how to make netflix clone with express api from scratch

[@javascriptmastery]

Great idea!

[@ferhattaher]

So happy to see this great course, will start it and finish it tomorrow 🎉😍

[@javascriptmastery]

Hope you enjoy it!

[@FastForward-i4s]

Your content is golden... but your primary demographic are coders, so you don't need so much graphics in your videos, explaining every word you say outside of the IDE. its distracting sometimes. If we decide to invest time into a 5h+ video we show that short attention span isn't a problem so you don't need this much flashiness to keep us engaged (I'm assuming that's one of the reasons) but you're my GOAT for actually learning web dev.

[@javascriptmastery]

Great point, thanks for sharing!

[@kushal6065]

but it's essential for total beginners. So he is doing good

[@md.anwarulislam19]

Aaaaaaaaa

[@jonathanadokwei2060]

I definitely doubt if majority of the subscribers will sideline with this. I really love it this way, to be honest (perhaps because I'm more of a visual learner).

[@MayurAthavale-u9b]

Yes, A new video dedicated to settings up tailwind config would be gr8

[@zainwasem]

Tata Group😍

[@javascriptmastery]

Yes! 😍

[@Joy-san]

yooooo thanks for the course bro🔥🔥🔥

[@javascriptmastery]

No problem 👍

[@drugoviic]

openai migrated to remix

[@javascriptmastery]

Thanks for letting me know

[@unitywithzaher1374]

Is this a Next.js or a Sanity video damn it!

[@stivdon]

On a scale of 1-10, How do you like MKBHD? 😂😂

[@javascriptmastery]

He's cool 😂

[@MandeepKaur-bb3nj]

Your teaching style and your material of next js is awesome and it helps me a lot to learn about nextjs 15.

[@klhmia]

Sanity should be renamed to INsanity.

[@Codewithbelieve1]

That was cold 😅

[@kurumi_lov]

Bro I was really confused and suddenly your video comes.. Thanks a lot

[@javascriptmastery]

You are most welcome

[@ahmadyakubuahmad7626]

Wowwww, the Bobshell Adrian, Thanks for the Good work Man

[@javascriptmastery]

Thanks!

[@killerboy5278]

The explanations you added in this video the diagram one are really incredible we want this in future videos as well . 💘

[@miquellais]

Thanks Adrian, great and high quality course as always. 🤝

[@tilokdutta1547]

Adrian you are great man. Also creating other document is really helpful. Keep it up.

[@ManiNasih]

Broooo, I swear I was following your next.js 14 full course and i was installing the dependencies And you Just Uploaded the Video ❤

[@dreamsachiever212]

🤣

[@javascriptmastery]

Yess, this new one is much better! :)

[@Shou06]

@@ManiNasih 😅

[@ahmedshaban9295]

Great video as always, Adrian! Good job, my friend.

[@javascriptmastery]

Thanks again!

[@briankclayton]

Protect this man. Excellent tutorial.

[@pemawangchuk2024]

Wow...Seeing such tutorial always motivate me to learn and move forward. Thanks Adrian. Thank you so much.

[@javascriptmastery]

Happy to hear that!

[@ВікторЧекірко-е2ф]

Awesome! The best channel to study Next!

[@javascriptmastery]

You're the best!

[@Invisible_Joy]

Thanks for creating such an amazing resource ❤ for us for free of cost

[@Khalid-khan-kakar]

Finally I got something new this weekend 🎉

[@javascriptmastery]

Enjoy! :)

[@luantran3762]

The best course I have ever learnt.

[@MarlonEnglemam]

can't believe there's already a course on next 15. Gonna go through it. We're starting a new project at the company I work and that's exactly what we needed to get a vision of what may have changed from version 14 to 15. Thanks so much.

[@javascriptmastery]

That is awesome!

[@ytdevs]

Great course so far, loving the graphs and deeper explanations. Thank you 🙏

[@javascriptmastery]

You're very welcome!

[@okekeemmanuel8852]

Long awaited 🎉

[@javascriptmastery]

Finally, right? :D

[@segalgbenou975]

Next.js 15 just launched! Adrian rocks 🚀

[@javascriptmastery]

Thank you! 🚀

[@MeYouTube-b6v]

He promised, he delievered. Thanks❤

[@javascriptmastery]

Always! ❤

[@ssashh]

The logout and login buttons worked for me without making them a form. Simply adding an async callback function in their respective onclicks worked fine!

[@Imacul77Game]

I knew you wouldn't disappoint 🎉🎉❤😊

[@javascriptmastery]

Never! 🎉

[@markus_dev_cwb]

Awesome project Adrian!!!

[@javascriptmastery]

Thanks a bunch!

[@sohaneftekhar1929]

I have been watching this channel since I discovered. I am waiting for a full fledged system design course on this channel please !!

[@javascriptmastery]

Noted!

[@klhmia]

Also, yes - the visuals in Miro are VERY helpful, thank you Adrian.

[@i_vishalsah01]

our boy is back with a banger!!!!!

[@javascriptmastery]

Thanks!

[@mike-p5g]

I dare your videos are some of the most profound videos on youtube web channel

[@chafaibenmehania]

thanks a lot, im one of the 1st 1000 devs that win the book

[@javascriptmastery]

Amazing!

[@blank-p7q]

Need to travel for few days..bro gave me content to watch

[@javascriptmastery]

Hope you enjoyed it!

[@IsaacOladimeji]

Adrian! Awesome man❤❤❤❤🚀🚀

[@javascriptmastery]

Thank you 🙌

[@benjyross4626]

This is the best video on web dev ever

[@javascriptmastery]

Woah, thank you! 😊

[@loldoctor]

As soon as you said you'd explain the files from the bottom, I knew this tutorial would be helpful. You've clearly thought about not only how to explain things, but also about the learner and what knowledge you might be assuming they possess. That's probably the hardest thing to do as a teacher, at least in my opinion. I don't have the money to spare for your course (just had a baby, etc) but I signed up for your newsletter and downloaded the PDF. Thanks again for what you do.

[@javascriptmastery]

Thank you so much for these kind words, congrats on the baby! :)

[@SkyrimBeast]

Thanks for everything you've taught us Adrian. Much ❤from Ohio 🙂

[@javascriptmastery]

My pleasure!

[@dnjosh10]

I'm privileged to be among to first 1000 devs to download the ebook. Thanks, boss. I pray I will be able to choose like you someday.

[@javascriptmastery]

Best of luck!

[@Shou06]

Man you are god was just thinking to explore next js 15. Weekend Booked will explore this.

[@javascriptmastery]

That's amazing!