How to Fetch Data in React with useSWR
Fetching data in React is more than just a useEffect hook. In this video you will learn how to use the useSWR library for remote data fetching and much more.
useSWR works with three steps: First, it returns the data from the cache, then sends the fetch request, and finally comes with the up-to-date data. All of this is handled for you automatically, and you can trust you components will get a stream of data updates constantly and automatically.
It supports great features like interval polling, focus on revalidation, scroll position recovery, request deduplication, and much more. Plus, useSWR helps with:
Keeping the data consistent among all instances
Avoiding multiple requests in every component that needs the same data
Keeping state in sync and avoiding subsequent request that may override each other
⏰ TIMESTAMPS ⏰
What is useSWR: 0:00
Before useSWR 1:44
After useSWR: 5:01
🔗 HELPFUL RESOURCES 🔗
useSWR Documentation: https://swr.vercel.app/
An Introduction To SWR: React Hooks For Remote Data Fetching: https://www.smashingmagazine.com/2020...
Caching clash: useSWR() vs. react-query: https://blog.logrocket.com/caching-cl...
Why You Should Use React Query or SWR: https://labs.thisdot.co/blog/why-you-...
👋 FOLLOW US 👋
Instagram: / skillthrive
#React #WebDev #JavaScript
