Next.js 9.3+ Data Fetching Explained: getServerSideProps(), getStaticProps(), and getStaticPaths()

[@Karlponken]

Great explanation! Had a hard time understanding the difference of these 3 from reading the docs, this helped alot! Thanks!

[@lalitvavdara5841]

probably the best explaination for data fetching capabilities of Nextjs...great work

[@anonysmooth648]

best explanation with real example, this is what I need in every tutorial

[@kulrajchavda9538]

Best explanation available on the internet!!

[@aidanwalker3058]

I struggled to understand between getStaticProps and getServerSideProps, watched a few videos but still didn't get it until yours. Greatly explained thanks 🙂

[@ado]

Great to hear!

[@maskman4821]

Thank you for the great explanations/demonstration/illustrations of data fetching, I am very glad to understand the differences between getServideSideProps and getStaticProps, the mongodb example is awesome for us to understand the differences between these two functions. Thank you so much !!!

[@piyshkmr]

Great Explanation. I really wanted a detailed video like this

[@rudeadyet1992]

This really cleared out some of the confusions. Thanks for the explanation. Appreciate it.

[@mr.rajeshmekala]

You nailed it Ado. Clear explanation with examples. Please Keep making videos.

[@ado]

Thank you :)

[@farstep4011]

This video is short and complete. Thanks for sharing!!

[@joebao2536]

very straight and practical explanation ! Awesome

[@computecastle6099]

Man, you are awesome. Was trying to understand these three data fetching methods for so long. Thanks!

[@justinlu5730]

the best explanation in all youtube, thanks ado, it helped me a lot !

[@MeganGrantCurlyGirl]

Love it. Keep up the good work!

[@sabeekaqureshi4259]

The best explanation I have seen on this, thanks!

[@emilioortega9487]

your explanation was amazing ! please keep posting these videos :) great work

[@evanlittle114]

Thank you, your explanation and demo was awesome and fully clarified how these concepts work

[@joelmuluh1]

Very excellent explanation!

[@saalimkhan4133]

Beautifully explained

[@fyardlest1]

Really helpful thank you! By the way, next time set the sound properly cause I have to push the volume up to hear, lol. We need more next js tuts like this one.

[@anthonysim563]

Thank you, this was an excellent explanation!

[@shailander13]

I was running on local environment where site builds on every refresh so got really confused between the getStaticProps and getServerSideProps. Now it’s clear thanks to this video. Also the explanation of getStaticPaths was very good with easy to understand examples. Great work👏🏻👏🏻

[@iShubhamPanchal]

Straightforward, Hands-on, Great explanation. Thanks buddy and keep going and I just subscribed .

[@blakefre]

Great great explanations. Thank you so much for this, very grateful

[@ado]

Glad it was helpful!

[@MahmoudALSrouji]

Greatly explained. Thank you!

[@devinflora]

Wonderful explanation! Thank you so much for making this video!

[@PawanKumar-tu6ti]

Thank you for so useful video, really appreciate that.

[@wfth1696]

Great explanation. It really helped me grasp it properly. Thank you!

[@jacobcambell]

Very well explained cleared my confusion thanks man 👍

[@cutipets8706]

Great video, great explanation Thank you so much

[@mohitsojitra3965]

Very well explained all the concepts.

[@lefterisk1872]

Man....your are awesome....for real....!!

[@hiteshagja24]

Very well explained.

[@ado]

Glad you liked it

[@carlosbenavides670]

Thanks for the video. Pretty useful.

[@ThePeerroo]

Hvala Ado olaksao si mi zivot :D

[@ankitdalasaniya2463]

You save my day... thanks brother...👍👍

[@skverskk]

Well done and very informative

[@ОлегПузанкін]

Thank you for such great explanation

[@ado]

Glad it was helpful!

[@tech3425]

Great Explanation

[@darksurvey2347]

really helpful.😊😊😊

[@yasamansifarianasl7030]

Thank you very much, it's really helpful for me! Please create more next.js videos

[@ado]

More to come! Anything specific you'd like to see?

[@rojitblaze13]

Was really confused about getStaticProps and getServerSideProps as it was doing the same thing. This really helped. Is it mentioned some where in the docs?

[@abasthurabli7630]

Thanks for the video. I learned a lot of things. 👍

[@GamerSolitO]

very usefull tutorial! This helped me more than the explanation of my college professor. Thanks man, you should upload more videos like this! New subscriber. you got some potential

[@garrysandhu4197]

Awesomeeeee Explanation.

[@ganapathipranesh8506]

Much neat and precise! thanks 🙏🏼

[@josephuzuegbu7431]

I love this video. Thanks

[@isaacemmanuel]

Very well explained, Thanks Ado

[@snpr9603]

Thanks! Very good explanation!

[@EVA_Hamza]

Awesome explanation, thank you

[@stevejohann5101]

Nicely done - thank you for your time!

[@ado]

My pleasure!

[@nikosspiropoulos8417]

very good explanation thank you!!

[@mirzadvarupa5652]

Hvala ti Ado! :)

[@babaganaabba785]

Thanks so much. This was really helpful

[@FranciscoHernandez-vh6bv]

Honestly great video

[@codingwithlucy]

Really nicely broken down, thank you so much :)

[@pavlo-vasylkivskyi]

Thanks! Wery clean explanation 🤗

[@zanbri]

One suggestion: the audio was quite low -- it would be helpful to normalize it to a higher volume. Otherwise, a great video - thanks!

[@leanprogrammer]

Great stuff! More nextjs videos 👍

[@javascriptprisoner900]

Wow! This video was really helpful for me. Thank you!

[@nahida4444]

one question about the getStaticProps and unstable_revalidate. You mentioned that it gonna update every second or every 10 mins (depending on what you set). Does that mean it can work as setInterval? I am trying to do make a cryptocurrency ticker, where I want the currencies will update every 5 seconds, so I am making api calls every 5 seconds using useEffect and setInterval. I wonder if I can make the function using getStaticProps

[@anphearab8250]

Great video ! Keep it up !

[@ado]

Thanks!

[@DanZ-fq2qs]

Great explanation mate, is the demo project open source ?

[@PuntielRealty]

Thanks bro very clear and understandable. How about handling form submit and storing the data?

[@neerajsinghtangariya2587]

I think in new version nextjs provided revalidate instead of unstable_revalidate. Right ?

[@shailander13]

right

[@adimardev1587]

thank you it helps a lot!

[@cutipets8706]

I have a question what if we set the callback to true and we typed in an id in the URL that doesn't exist in the database how can we handle this situation?

[@mroobert]

Great content! Liked & Subscribed

[@ado]

Awesome, thank you! Much appreciated!

[@markusbuchanan6130]

Great Video! Just had a question : Is there any benefit to making fallback false? It looks like its just going to error out any new pages for new data that will be added in the future based on the video to me.

[@dawid_dahl]

Great video. Subscribed!

[@testrandom1852]

Thank You!

[@abdulmoeez13]

Keep It Up ❤️

[@sabassegovia3915]

Awesome video!

[@djelasrca8091]

can you put link to the github repository? I would like to take a look on your function for data fetching

[@dushyantkumar4428]

Nice Video. Can you add more info on incremental static regeneration?

[@ado]

Hey Dushyant, yes I will create a video on it next week!

[@ado]

Made it: kzbin.info/www/bejne/f3vOhaOIbNiGras :)

[@igotbit9454]

Very useful. Subbed

[@kirillpavlovskii8342]

does node js express server runs under the hood to constantly fetch data and serve it in getservsideprops method?

[@DanFlakes]

Great tutorial!

[@hiberniankingy]

so correct me if I'm wrong here but do these fetch methods mean you don't have to rely on useEffect?

[@igorr4682]

Nice gb music 🎺

[@mohammedhijas106]

Nice one !

[@davidsonzed]

This is really awesome, can you also make a video about hooks

[@rafahdez2772]

is there any way the I can pass information from getStaticProps to getStaticPaths so the app doesn't have to do 2 request getting the same information??

[@drworm1110100]

Thanks!!!

[@pannihto7588]

Quality content. Just gotta work on editing a little bit :)

[@ado]

Thanks! yeah it's a work in progress :)

[@ivaylopetrov9956]

Good job man

[@hoodieson2008]

Nice! Actually took something away from the video!!

[@user-ce4ct8ws8r]

Hii there, I have a question .. What if the data fetching takes time ? would gSSP hold the page rendering or will empty page will appear?

[@Rusakin]

how to revalidate in getserversideprops?

[@FitnessChaos]

Why do you compress lines of code? How can a viewer understand the context of the code if you got lines compressed / hiding.

[@berlino5563]

Hi Ado, cool your channel :) i have a question: i'm working a fullstack app with Next js and a headless cms as backend restfull api. I need to handle logout user with jwt in cookie httponly (server side - not access in client side). what approach do you recommend about to implement logout user? what is the simplest and fast solution?

[@ado]

Hi Berlino, that's a great question. For all things authentication and authorization I usually prefer to defer things to Auth0. They have a really good Next.js library (github.com/auth0/nextjs-auth0). But if you're rolling your own solution, I would just create an API route in Next.js to handle that logout call. In Next.js API routes you have full access to the request object so can destroy the cookie there thereby logging the user out. Let me know if this helps!

[@aseeldweedar180]

thank you

[@muhammadalbab2678]

i'm a bit confused, then what is the difference between using only the useEffect hooks to fetch data and the getServerSideProps() ? can someone pls explain

[@romimaximus]

Ok, so if i use the "getStaticProps " and "getStaticPaths", and build the app, and deploy it, ... and every time , something changes in the database, i gonna have to rebuild the app and deploy again ?...this kind of confusing.. 🤔

[@mitchellbenjamin3071]

thank u

[@online-notary-us]

Where is the code to help us follow along?

[@moosegoose1282]

uhh how is data being passed from props to ur component? u didn't show that at all

[@malikbrahimi7504]

Can you do a tutorial on handling concurrent clients? For example if I'm on a page /item/:id where id=1 and another user deletes that resource from the DB, what should happen to me as a user while I'm on that stale page? What if two users are mutating an object at the same time?

[@ado]

Hey Malik - that’s not a bad idea. I’ll create a video on it next week. :D

[@gjahnavi1688]

@@ado hey,can you explain me How to import that "fetchGraphQLQuery" in nextjs

[@Psychobellic]

I'm going crazy with this lol... NextJS was so easy until now xD how can I get a query from the user and then run this query fetch in server-side? My API key cannot be exposed =(

[@alooooooola]

so if facebook has 1 billion post so their backend has to query for 1 billion post id then frontend has to call an api to get that 1 billion paths. It sounds wrong for me

[@ado]

If they wanted to pre-render all of that content, then yes, but they're unlikely to want to pre-render all of it ahead of time. With Incremental SSR though, those pages can be generated when they are requested and still served statically.