Optimistic UI Updates in React
Instructor
Erik Aybar- React
^16.0.0
No matter what type of app you’re building, you're going to need to fetch data, display it to a user, and enable the user to interact with and update that data. This interaction and updating phase is often asynchronous by nature which presents you, the developer, an opportunity to provide a range of different experiences depending on the scenario.
In some instances, you can leverage what is known as optimistic UI updates for an improved, snappier user experience compared to a traditional “loading/waiting” experience. They aren’t suited for every use case, but selectively making use of optimistic UI updates throughout your application can have a significant impact on the quality of user experience for relatively little cost and complexity!
In this course, we’ll walk through implementing optimistic UI updates in the real world example of liking and unliking a tweet. We'll use React's built-in state and make use of extracting setState updater functions to help manage and better define our setState usages.
Learner Reviews
- Vijay P R4 years agoWhat did you like about this course?
Optimistic Updates were a completely new idea to me .Have seen this in websites like Facebook, Twitter etc but the implementation details and handling of corner cases were clearly explained . Speed is exact and anyone with a reasonable knowledge in React and JS can learn it . Didn't bore with unnecessary stuffs.
Taking it to next level by optimising some of the steps is now our job :)
- Rodrigo Erades5 years agoWhat did you like about this course?
short, conciss, well explain. I got the point of this tutorial , great !
- Bruno5 years agoWhat did you like about this course?
The good: I actually know how to create an optimistic ui now so it delivers what was promised.
The bad: You talk very slow and sleepy which makes it hard to keep attention. More enthusiasm please :)
- Isa Chen5 years agoWhat did you like about this course?
Simple techniques that are well explained, quick to watch.
- Fernando Gomes Oliveira Teixeira5 years agoWhat would make this course a 7 for you?
add some real requests on some API
- Dusan5 years agoWhat would make this course a 7 for you?
Nice lesson but nothing surprisingly new here.
Course Content
You might also like these resources:
Introduction to Cloudflare Workers
Become familiar with the Workers CLI wrangler that we will use to bootstrap our Worker project. From there you'll understand how a Worker receives and returns requests/Responses. We will also build this serverless function locally for development and deploy it to a custom domain.
Create an eCommerce Store with Next.js and Stripe Checkout
This is a practical project based look at building a working e-commerce store using modern tools and APIs. Excellent for a weekend side-project for your developer project portfolio
Practical Git for Everyday Professional Use
git is a critical component in the modern web developers tool box. This course is a solid introduction and goes beyond the basics with some more advanced git commands you are sure to find useful.