What's New in React 19 - Major Changes and Updates
Discover the latest updates and major changes in React 19, now stable. Find out what React developers should watch out for and get insight into the key features and improvements in React 19.
Install Tubelator On Chrome
Video Summary & Chapters
No chapters for this video generated yet.
Video Transcript
So, hey everyone, welcome back, welcome to another exciting video
And in this video, let's talk about React 19
So, yesterday there was a post by React team
In which they said that React 19 is stable
So, let's see what are the major changes in React 19
And as a React developer, what you should be worried about
So, with that, let's start with the video
So, React 19 is now stable, that's good
So, there was a post in April as well
So, I made a video on that as well
So after that there are some more changes
So here there is something which I want to tell you
So we will see this later
So let's see what are the things in React 19
So we will cover this video in 3 things
No.1 is what's new, improvements and how to upgrade
How to upgrade is kind of easy
So let's start
First of all we have actions
So in React 19 we have a new feature called actions
So what are actions?
A common use case in React application is to perform data mutation and update the state in response
So, what you do most commonly is, let's say you have a form
So, what you do is, user clicked on the form, you call a handler function
What do you do inside the handler function?
First of all, you try to say setLoading true, means we are loading something
Then you make the API call
Now, when this API call gets completed, we do setLoading false
then if this API call fails, we set some error state
and if it is successful, we set our successful state
so this is how we do right
so you can see that we have a very simple handle submit function
so first of all we will true this pending
then we will update something
then we will false this pending
if there is an error, we will set the error
else we will redirect the user
so this is a common use case
but in react 19, you have something known as
if we go down, in react 19
you have something known as use transition hook
so this is a new hook from react 19 team
so what you can do is, you can just say use transition
so isPending startTransition
we will do startTransition and in this
we will pass our asynchronous function
now interestingly here I don't have to handle this pending state
so this particular function takes an asynchronous
a promise function as a parameter
and till the time it is in pending state, this pending will remain true
