Full Video - • All React Hooks Tutorial 2025 ( +Building ...
Let's understand React hooks like useState, useEffect, useContext, and more, breaking down their functionality and use cases. We will also compares useLayoutEffect vs useEffect, dives into advanced hooks like useReducer and useTransition, New React 19 Hooks, and demonstrates how to build custom hooks as well.
useState Hook basically returns us and an array here. Right. And this array contains two things. First is the actual state or the variable or whatever you want to call it. So I'm going to say count over here. And other is going to be the function which is going to be used for changing that particular state.
So I’ll say setcount. Okay. And this right over here in the parenthesis, it takes the initial value that will be provided to this count right here. Right. So I'm going to say zero for now. So by default, our count is zero. Now, over here inside of this div I'm going to have a p which will say you clicked whatever times, let's say zero times, but we don't need to write the zero right here since we have this state over here.
So I'm going to say count over here. And now if I go back, you can see you clicked zero times. Yep, that's fine. But how do we use this set count to update this state right here? So let's create a button which will say lets say increment. So I'm going to have a onclick function right here, which will call this setcount.
And now we will take the current value of count count and we can set count plus one right? So yeah, that is all we need to do. So let's go back and if I click on increment, you can see it has started incrementing it just like that.
#reactjs #javascript #webdevelopment