First time switching to Next JS and what caught me off guard was that there was no src/ directory and everything is under pages. I think this is something that took me a while to wrap my head on the idea of the directory structure. Great video thanks!
Oooh come on, this is Great Video on NextJs ever!. But why u all guys just watching without hit Like button. Great work, i love your doing, keep it up👍🏻
@@codedamn When can we expect it? Because if we take the 1337 plan for one or two months for it, and the course remain same for that period, Then we will be 'fooled'.
36:10 Dropping query parameter that matches the route parameter name is expected behaviour. The documentation also mentions this. > However, route parameters will override query parameters with the same name.
50:04 - this might be confusing for people. As the visitor does not take any load of building the page. The user would have to wait a bit longer. The load of building the page is always taken by the server.
Thank you so much for providing us such a valuable resource for learning nextJs. Just one minor feedback - please try not to switch windows so fast, it can make viewers dizzy.
Hi Mehul, in case of get static props and re validate is set to 10 sec, lets say that data has been changed on server side/ or a database update ... but for that particular data user is only checking front end(i.e second request ) after few days or months and still sees old data ? how should we look at it ? Isn't it showing wrong data on screen confuses users ??
Amazing content, thank you Mehul. This is the third long video I watched on your channel. A quick question: whenever you talk about static website, does that mean that nextjs server on the backend is not necessary? if so, how does new content (additional post or change in the layout of the page) get reflected on the website? does that require starting the server for a short period of time followed by build process followed by redeploy as a static website?
You're right. If Next.js has generated the "static" webpage, it means that the framework as already created static HTML and JSON files for that page and pushed to CDN (or file system) for fast delivery. The way new changes are reflected is that when you deploy a new version with changed CSS, etc. you rebuild the app and it gets deployed with different file names (file hashes), therefore your browser can download fresh builds from the newly served .html file instead of stale ones (which had a different name) The way changes are reflected while the server is running is that Next.js will set an "expiry" on the CDN for incremental static regeneration. When the file request expires, the CDN will still serve the stale file to user, but would request the host origin to send updated page. Next.js, already running under a node process on host, will re-render the page and send it to CDN for further requests. This happens at most every X seconds (the revalidate parameter). Here I am assuming you have deployed your app on Vercel. If not, you have to take care of the CDN and ISG handling yourself, which sounds like a pain honestly haha.
u have a question sir ,,in serversideprops part 1 u said nexyt js will make the page as ssr but ssr is good for seo soo we should have it in all pages ...i have tested just by adding the function next js mark page as ssr in build analysis soo tell me what im saying should it be good for seo purpose to just add the function ? please help im confused
@1:19:15 what if somebody will make a lot of requests and the server will generates a lot of stored pages, then exceed the limit of free space and hangs
Preview mode: does that mean once you enable it for one route it is always enabled for other routes (using cookies) and it will impact the performance? How you can disable it programmatically rather than deleting the cookies?
I don't understand why we would use `getStaticPath`. If I want a route like `/store/[id]` and I want it to store the information about this page (say fetch information about ID and save it on cache)... how can I fetch it dynamically, if `getStaticProps` cannot access the id? HELP!
Hello Rahul, just rewatched the video once again; following question crossed my mind: is it possible to connect to db and perform any read/write operations using serverless functions of nextjs? or is the only option to build a separate server e.g. using expressjs and in that server handle all connections and db operations in that server?
Yes, you can. You don't need to have a different server to read/write to a db. Check next template repo and you would see different db connection templates
@@leanprogrammer I think the question you meant is maintaining state changes at the component level when their is a change triggered in the UI component. That's where state machines/state management tech comes in like Zustand, XState, Redux, etc
Learn NextJS using the Full Stack Developer Roadmap on codedamn and build over 25 Projects: bit.ly/fullstack-codedamn
Dude, you always come out with some of the best videos. Love what you're doing.
I appreciate that!
@@codedamn Always my friend! 😁
Totally agree with Coding Nuggets. It has been a pleasure to follow your Next.js videos
Even as an experienced NextJS user it took a lot out of it. You explain quite well!
Thanks for this extensive explanation. I found it really helpful.
I am New to nextjs..best explanation I have found so far. Thank You!
when you used codedamn as a query it overwrote it because object keys a unique. So, it wasn't a bug. You are awesome!!!
You're REALLY good at explaining this stuff...
Great intro to Next js, thank you!
This isn't an "advanced" course, just an intro?
I'm truly amazed on dynamic loading
thanks for this tut
You're welcome!
First time switching to Next JS and what caught me off guard was that there was no src/ directory and everything is under pages. I think this is something that took me a while to wrap my head on the idea of the directory structure. Great video thanks!
You can put it in src if you want to. I do, and prefer it that way 👍
Thank you again, for another kick-ass tutorial. Wondering if you can create a CLEAN CODE video and best practices.
Oooh come on, this is Great Video on NextJs ever!. But why u all guys just watching without hit Like button. Great work, i love your doing, keep it up👍🏻
I was 100% convinced to buy the course on code damn after this tutorial. You're such an awesome teacher especially how you break down everything.
This is the best tutorial on nextjs data fetching🙏
Fantastic tips, learned a lot! Thank you!
Really amazing content. Didnt find any tutorial as in depth as this one.
This was fantastic, thanks for helping me dive a bit deeper. Loved the explanation for revalidate, awesome!
This was great! Really well thought out explanations! I learned a lot thanks :D
The explanation on revalidate parameter was excellent
Glad you understood!
Bro, Kool Stuff! Awesome! Keep up the great work!
thanks for explaining revalidate
You're awesome bro!. Learnt a lot!!!
This is awesome! Can you also cover other libraries used with next, like react-query, GraphQL etc... Would be great
That is going to be part of React Mastery learning path and Next.js Mastery on codedamn.com, soon!
@@codedamn When can we expect it? Because if we take the 1337 plan for one or two months for it, and the course remain same for that period, Then we will be 'fooled'.
This is a great video!
36:10 Dropping query parameter that matches the route parameter name is expected behaviour. The documentation also mentions this.
> However, route parameters will override query parameters with the same name.
i'm really excited for this ❤️
it was extremely useful for me
Awesome 🔥
Best next js tutorial
thanks man. you explained this so well❤️❤️🔥
Thank you so much for this video. Much appreciated.
hey bro, don't let those negative comments discourage you, you did a good job, l have learned a lot from this video, thank you so much
I really enjoyed, thanks so much
50:04 - this might be confusing for people. As the visitor does not take any load of building the page. The user would have to wait a bit longer. The load of building the page is always taken by the server.
Thank you very much!
Your teaching is awesome, may you please make one video for crud operation using api , micro service type. That would be great
Great content. Can you talk about deployment options available and downsides of scaling with next.js?
36:13 It is not bug. Because, JavaScript object can't have two properties with same name.
Thank you!
Wow! this video is a GEM
How can I add loaders on page with fallback set to "blocking" ?
Thank you, Mehul!
Welcome!
Thank you so much for providing us such a valuable resource for learning nextJs.
Just one minor feedback - please try not to switch windows so fast, it can make viewers dizzy.
Will keep in mind, thanks!
Hi Mehul, in case of get static props and re validate is set to 10 sec, lets say that data has been changed on server side/ or a database update ... but for that particular data user is only checking front end(i.e second request ) after few days or months and still sees old data ? how should we look at it ? Isn't it showing wrong data on screen confuses users ??
Great Video...!!!
You're really amazing
Thank you!
Omg awsome
Let start looting. Thank you 👍
Amazing content, thank you Mehul. This is the third long video I watched on your channel. A quick question: whenever you talk about static website, does that mean that nextjs server on the backend is not necessary? if so, how does new content (additional post or change in the layout of the page) get reflected on the website? does that require starting the server for a short period of time followed by build process followed by redeploy as a static website?
You're right. If Next.js has generated the "static" webpage, it means that the framework as already created static HTML and JSON files for that page and pushed to CDN (or file system) for fast delivery.
The way new changes are reflected is that when you deploy a new version with changed CSS, etc. you rebuild the app and it gets deployed with different file names (file hashes), therefore your browser can download fresh builds from the newly served .html file instead of stale ones (which had a different name)
The way changes are reflected while the server is running is that Next.js will set an "expiry" on the CDN for incremental static regeneration. When the file request expires, the CDN will still serve the stale file to user, but would request the host origin to send updated page. Next.js, already running under a node process on host, will re-render the page and send it to CDN for further requests. This happens at most every X seconds (the revalidate parameter).
Here I am assuming you have deployed your app on Vercel. If not, you have to take care of the CDN and ISG handling yourself, which sounds like a pain honestly haha.
@@codedamn understood, thank you!
If getstaticprops can now re validate. Then when should i use getServerSide props
Can we implement env profiling like sit uat urls in Nextjs ?
u have a question sir ,,in serversideprops part 1 u said nexyt js will make the page as ssr but ssr is good for seo soo we should have it in all pages ...i have tested just by adding the function next js mark page as ssr in build analysis soo tell me what im saying should it be good for seo purpose to just add the function ? please help im confused
Would it be possible to update this video by using Next.js 13? Thank you
Thanks
WHERE CAN I GET A LENGTHIER VERSION OF THIS COURSE?
@1:19:15
what if somebody will make a lot of requests
and the server will generates a lot of stored pages,
then exceed the limit of free space and hangs
Gold
Preview mode: does that mean once you enable it for one route it is always enabled for other routes (using cookies) and it will impact the performance? How you can disable it programmatically rather than deleting the cookies?
Can you please share your vscode settings also which theme you are using? Looks awesome
I think the theme is Monokai or something related to Monokai
Can you add a tutorial for nextjs with redux setup
name of the vscode theme??
8:22 If it doesnt use JS to include env variables, then how exactly does it include them?
Hi Mahul Bhaiya.. Thanks for the advanced tutorial.
can I use react context hooks inside getServerSideProps()?
when should you only use dynamic import?
Is there any work around to make next/image work with next export? Build is crashing
bro i want to learn next js only not full stack can you give the link for next js i will buy that.
Nextjs is not working for me. Can someone explain the internal server error it suddenly gets collapsed. What to do on this?
Vs code theme ??
I don't understand why we would use `getStaticPath`. If I want a route like `/store/[id]` and I want it to store the information about this page (say fetch information about ID and save it on cache)... how can I fetch it dynamically, if `getStaticProps` cannot access the id? HELP!
getStaticPaths is just a helper method available to work with getStaticProps. Your "id" will be received in getStaticProps
velcome!
Gracias mister......saludos de los andes peruanos
Gracias. No hablo español, pero traduzco Google para ganar.
can u help me protecting routes using context in nextjs?
Super
i like ur voice
Hello Rahul, just rewatched the video once again; following question crossed my mind: is it possible to connect to db and perform any read/write operations using serverless functions of nextjs? or is the only option to build a separate server e.g. using expressjs and in that server handle all connections and db operations in that server?
Yes, you can. You don't need to have a different server to read/write to a db. Check next template repo and you would see different db connection templates
@@emmanuelugwuoke967 Thank you, Emmanuel
why youtube prevent me to like this video more than one like -__-
Pls Mehul post your nextjs project on youtube pls
How do you manage state in the complete course?
Which state?
@@codedamn application state. I've seen there an e-commerce app.. Do you use graphql + Apollo or RESTful API + Redux?
@@leanprogrammer I think the question you meant is maintaining state changes at the component level when their is a change triggered in the UI component. That's where state machines/state management tech comes in like Zustand, XState, Redux, etc
@@leanprogrammer Graphql changes the representation of the protocol that is going to be consumed by multiple client applications.
what about getInitialProps?
It is deprecated and you can work without it too
Good
Thank you member 😄
code pls 🙏🏻
Someone please tell me the VSCODE theme in this video.
Monokai Dark
@@codedamn Thank you.
What about subdomain
Can you elaborate more?
@@codedamn I am just asking if you can make a video on how to handle sub domain routing with next js
nest.js bhai ... nest.js .....
I'll get my hands on with it, then you can expect some content ;)
I dont see what's advanced about this course
I'd never heard of Jawa script before... very interesting and looks a lot like Javascript.
Thanks
Welcome!