React Suspense Introduction (Data Fetching)
HTML-код
- Опубликовано: 12 сен 2024
- In this video we're just going to experiment with React Suspense data fetching. Suspense is still an EXPERIMENTAL FEATURE at this time.
Sponsor: Freelancer Bundle (Promo: TM25)
gumroad.com/a/...
Suspense Docs - reactjs.org/do...
Concurrent Mode Docs - reactjs.org/do...
💖 Become a Patron: Show support & get perks!
/ traversymedia
Website & Udemy Course Links:
www.traversyme...
Follow Traversy Media:
/ traversymedia
/ traversymedia
/ traversymedia
I don't use react but liking and leaving a comment on your video is the least I can do. Longtime fan. Keep up the good work.
Thanks bud, I appreciate that :)
@@TraversyMedia Could you please look into Cubejs, the documentation is pretty limited. And if you could do a Realtime Dashboard with Angular & Cubejs that will be awesome.
Just came by to thank you for all your great free content, Brad. You are really helping a lot of people.
Thank you :)
Brad always reading our minds. Just what my job started using and I had NO CLUE what it was. I do now 😏 thanks Brad!!! 🔥
I love how you had a "What the Hell did I just do?" moment during this video! So relatable.
Thank You
Thank you
im new to the channel, and new in web design / development (this is my 3rd week), i have my first course ever on udemy, your course modern html/css , and i love it. Im by the news grid project in the course :), and planing to take the jave script after
Thank you very much
greatings from "Vienna"
console.log(`You are welcome!`);
Traversy Media
alert('haha thx for eveything Brad!')
You are not closing the h1, h3 and p tag correctly. You also forgot to include the CSS file. '.color' class will not change the properties of text inside the span tag. 😀
@@gambomaster 😁you right
Cringe...
Who the hell dislikes a Traversy video?
WHOOOOO????????
People who understand it as 'dis I like'.
Techlead's followers 😂😂
I'm so glad this came out just now! I'm building a web app for a client who basically needs everything dynamically fetched, and this should make it soooooo much less painful handling the loading state.
You're always just making us wanna learn like non stop Mr BRAD tanks a lot and may GOD bless you more and more.
I thought react suspense was that feeling you get when you're trying to finish at least one component before they have a major update.
Love your content! Thanks for keeping me from getting fired.
thank you very much. all your videos are extremely helpful. thank you for your time invested in creating them.
Great tutorial. All of his videos are outstanding.
Thank You Brad!
PS : When You'll Release ( Web Development In 2020 - A Practical Guide )?
Working on it now. By 2020 :)
I love this guy. Your classes are amazing!! Keep doing this.
Just now thinking about this topic and here it is! 🙂
Please make a video on how to use gmail api for sending messages from nodejs backend
Thanks for the intro Brad. Always good to know what's coming up in React world
Just I want to say thank you for your time and valuable video very useful
Thanks for taking the time to go through this.
You explained this SO well.
Thanks sir! Are you planning on any react native course?
can you do an aws based event recommandation project ?
Hi Brad, would you make a tutorial on how to bundle nodemailer and react to make a working form? Thank you so much.
This looks like a lot more work than just to use if statements
This was super easy to understand, thank you
A video series on React PWA will be really helpful. Thanks for all your efforts btw.
React already comes with PWA integration, you just need to build for production and test it using a server like http-server www.npmjs.com/package/http-server
15:47 Hi, Just some tips for any React developers out there, should your compiler throw any warnings such as in this video. Instead of searching/ finding the keyword "wrap" in the whole document. U can look up at the filename, line number and column number in your terminal.
In this video ( API.js Line 2;10 'wrap' is defined but never used.)
This is what I do on daily basis where upon done doing any changes I will try to look up to the terminal to clean up any compilation warnings before pushing my commits to remote repository :)
By 12:00 I'm already just fine with using if/else. This looks like the type of stuff you understand while writing and then makes absolutely 0 sense when revisiting the code 1 month later. You need a "tutorial for the tutorial" of Suspense here.
So finally we don’t have to manage loadings anymore... thanks god!
What? Replacing 1 line of code with 100 lines of boilerplate is a "thank god"? Thank god I dont work with those kinds of developers.
@@avi7278 Thank God I don't work with boring elitist like you... and Thank God not lots of people will in future.
thanks man! loved it.
What does it mean by "throw suspender" ?
We know about throwing exceptions, but what's throwing the promise doing ?
"Too much node". Yesterday I saw that es6 modules are officially part of Node. You don't have to use common js
Brad is a great person !
My favorite coder
I take it you can still do a redux provider like .render() in index.js
Yes
you are the best!!!!
Thanks for this bro... You're the best
Seems like a lot of boilerplate to avoid an if statement. Not for me.
the purpose from what I can see is to remove conditional logic out of the component render.
No shit... this is the definition of over engineering.
@@alphaseinor I'm nearly certain that I could remove that condition without an extra 100 lines of boilerplate.
I was all in, until the wrap promise method and checked out, seems way too complicated
9:53 wrapper that arouse 🤣🤣🤣🤣
You can also nest those two Suspense elements and it would only ever show 1 spinner at a time
React Suspense for sure arouses me @Traversy Media :D
Great content as always.
sir I love your video let me see this ...love u sir you are God for me sir I am a 3rd year btech student tell me about the projects sir pleaseeeeee
Sir, Could you make a tutorial playlist on Wordpress for making an E-commerce website and deploying it? Please fulfill my wish. I am your regular viewer, subscriber and a great fan of your art.
Why didn't you use async/await instead of .then?
more react videos !!!!
I know, I need to, it's just so many of my viewers use so many different frameworks, I like to create videos that everyone can relate to. But I will try and do more React
Hey brad, are you interested making video/tutorial about web components in the future?
thanks traversy!!
thank you Brad! and can u share the code with us ? =)
@11:40 Can anyone please point out which dot then is catching the suspender or result error???
Thanks Brad.. what about something about blockchain..!😁
Great video. But omg the writers of react seem to be paid per line of code. Why is this any better than setting result equal to a spinner until data is fetched?
Thank you!
LOL, I got the {wrap} from "./modules" as well...Damn IDE trying to outthink itself.
So this is basically try/catch for components? If Suspenses child throws an error it will just render the fallback stuff
pretty much it
Yes but it's declarative not imperative
vs code auto import imported this wrap thing in your code.
I wish there was any way to customize vs code auto imports.
I had a colors object stored in my theme.js file, everytime whenever I type Colors in my code it auto imports Colors from somewhere inside node modules.
Is there any reason to use this in today's development?
I used this exact same method but my state keep getting getting resetted to the initial null value every time. I can't pass my state as props to another component because of that. Anybody know what happened?
Does it also apply for React Native the same way?
that was avaliable in react 18?
Just wanted to say I've always really enjoyed your videos, so much so that I reference your channel in the book I just wrote. It was released recently. It helps to teach beginners and intermediate level programmers learn Python and some Analytics libraries. Feel free to check it out. You can find the shout out on page 322.
Thanks!
will it work in react native or just for react ??
Thanks for shared
Thanks.But users api didnt work ))no problem in code but doesnt work
love you
I like ur videos
Just another positive comment)))
Damn react is full of boilerplate from hell and apparently they dont even think about changing that fact.
import React, {Suspense} from 'react'.......... wait wut, you could do that?
awesome
please update your course in udemy (reactjs)
I don't understand what the advantage is to doing this rather than just checking if your data is null first
I dont get it. Is this really a pain point? You didn't have to check if user === null ... you simply replaced it with 100 other lines of unreadable code and for what benefit? So you can defer rendering a component until it has data? It just seems like putting in two regular pennies to get a shiny one back. Is your shiny penny worth it? Probably only to applications on the scale of Facebook.
1st view.. :)
Fast 3g .. That will be still slow 😅
please multilanguage react :X
Comment
your video title is about react suspense, you should just explain about it in short and simple way but you made it so much complex things and explained unnecessary things in these video, these video is not upto the point , waste video