Learn the useOptimistic Hook in 19 minutes (Next.js 13 For Beginners)
Sonny Sangha Sonny Sangha
260K subscribers
15,530 views
0

 Published On Premiered Jul 20, 2023

🚨 Join my course Zero to Full Stack Hero: https://www.papareact.com/course

The useOptimistic hook provides a way to implement OPTIMISTIC updates. These Optimistic updates enhance the user experience by making the app appear more responsive to the user by displaying instant results on the front end.

πŸ”΄ LOOKING FOR THE CODE FROM THE BUILDS? πŸ› οΈ
https://links.papareact.com/github

πŸ“© WANT TO LISTEN TO THE EXCLUSIVE PAPAFAM PLAYLIST?
Sign up for the PAPAFAM Newsletter here πŸ‘‰ https://links.papareact.com/newsletter

πŸ‘‡πŸ»FOLLOW ME HERE:
Instagram: https://links.papareact.com/instagram
Facebook: https://links.papareact.com/facebook
LinkedIn: https://links.papareact.com/linkedin
Twitter: https://links.papareact.com/twitter
Discord: https://links.papareact.com/discord

πŸ’° WANT TO SUPPORT THE CHANNEL?
Donate here: https://links.papareact.com/donate
Grab some PAPA Merch: https://links.papareact.com/merch

πŸ• TIMESTAMPS:
00:00 Introduction
00:14 Explaining Optimistic Updates
00:48 useOptimistic Demo
03:25 Explaining the useOptimistic Hook Demo Integration
04:41 Explaining the Backend Integration
05:52 Building the Frontend for the useOptimistic Demo
07:11 Implementing a Simple Counter
09:34 Implementing the useOptimistic Hook
10:38 Simple Counter vs Optimistic Counter
11:24 Building and Explaining the Optimistic Counter Component
16:12 useOptimistic Demo & Explanation
17:58 Bonus Tips & Tricks
19:06 Outro

Let’s get it PAPAFAM πŸ”₯.

#nextjs #reactjs #serveractions #tutorial #javascript #beginner #webdevelopment #tailwindcss

show more

Share/Embed