Great Video! I was almost giving up on Redux because of the boilerplate and setup, but useSelector and useDispatch made my life a lot easier. Excellent explanation!!!
I know im randomly asking but does someone know of a way to log back into an instagram account..? I was dumb forgot the account password. I would appreciate any help you can offer me.
@Gerald Jace Thanks for your reply. I got to the site thru google and im trying it out now. Takes a while so I will reply here later when my account password hopefully is recovered.
man you saved my life with these hooks. so clean and easy. watched a ton of stupid tutorials till i reached this one and its so easy to understand. thank you brother i subscribe now. have a great life! petri from romania.
@techsith All your tutorials, be it HTML, CSS, JS, and now React have been very concise and straight to the point and informative. That's what I like about your tutorials on UA-cam. And that keeps me frequenting to them time and again. Keep doing the good stuff which you are doing now. And, also I am obsessed with the ending background music. Can you share the source for the same? I tried Shazam but it shows "No results". The music sounds very pumping and full of adrenaline.
That's was really a very nice explaination n the thing i liked the most when you cleared about useReducer , that it's not a redux thing. This was the thing I wanted to clear out.
Not sure I really like useDispatch({type: ACTION_NAME}); Now need to import ACTION_NAME and also know the keys that need to be given to the object. WOuld be better if we could combine useDispatch with action creators somehow.
Awesome tutorial... I think I'm beginning to catch up... lol. Its the first techsith tutorial I walked into, already knowing everything that would be covered (because I have already started using these hooks in ongoing projects). Thank you Techsith
One of the most common thing which most of the developers lack is the habit of not reading the documentation provided by the concerned tech... And the youtubers take advantage of that, they do read the docs well and present the same in their videos and we simply applause them... And by the way I am not an exception, I too do the same mistake😂😂🤣
Very useful. I've been few days reading the Official manuals from Redux and I couldn't see if they useDispatch and useSelect actually replace connect functionality or not.
I love hooks, but I don't think I will be using this for my functional components. I can't imagine any way to make this as nicely unittestable as with `connect`. If you separately export the non-connected component for unittesting, you need can super conveniently inject whatever you want without needing mocking/context etc.
Yes, that is an important question. I dont think its that hard to mock any of this as they are bunch of imports and functions. If you know react-testing-library some nice solutions for that.
I think for those who are using Apollo and Graphql can manage this. But I see Face book and Airbnb use redux yet. I think it's still useful for very long application s with hundred of thousand of components. But I don't know if I really need to catch global state such as a login or sign-up or just still using higher order component with Apollo to pass the token .
i have a question, why you didn't define action? all other document, they still define action in action.js , but in your video, i didn't see any action, only the reducer why?
In this video my objective is to simply show the new hooks not the build full fledge project with proper structure for that you can checkout my redux series.
Change the light bulb? Are we mutating the light bulb directly? How dare you. Of course we build a new light fitting next to it, then destroy the old one ;)
I would say for smaller applications useContext and useReducer will be enough. When your applications grow in size, Redux tooling like redux-logger and redux-thunk come in handy for debugging and cleaner code, so I would stick to Redux for bigger applications.
getting totally confused with, in one hand useSelector+useDispatch and on the other hand useReducer+useContext…….are they the same? when to use one pair or the other? does it really matter when to use one pair or the other??
Pedro, useSelector+useDispatch are actually redux inbuilt hooks. as I explained in the video. useReducer + useContext are react inbuilt hooks they are sort of alternative to redux. It doesnt really matter which on you use.
Im a front wnd intern and we are currently working on a project where we use hooks and redux .i hope we can use this one ..can we mix this with midwares like saga or thunk?
I tried the same method in react native app but it gives an error something like this : "undefined is not an object eveluating 'state.counter' " please help me
I actually saw your reply late so, sorry for that. and I found the reason for the error is that I was not using the default case which returns the state itself like this " default: return (state)" in switch statement located in my root reducer js file. After solving this issue it worked. that was actually my own problem, and not the problem caused by watching this tutorial. So sorry for that.
can you make a tutorial on how to fetch api data and have it in state, list them and add them to cart, remove, see product info? the simplest way. thanks bro!
Hello Sir, you are awesome, thanks for this wonderful explanation, I have few doubts regarding hooks 1. Can we use some hooks(useState) in a class based component?, 2. Since we have this useSelector & useDispatch, then why there is again a new thing useReducer, Is there a advantage over one another. 3. Since we can acheve the store data using hooks, I beleive, we can develop the application completely using Hooks (useState, useEffects, ...), Then No need for Presentational & Functional pattern ? Anyone agree. 4. In the example video, while calling dispatch, you called using arrow functions onClick={()=>{ dispatch(....)}}, But for performace reasons this is better `onClick={dispatch.bind(this, { type: "INCREMENT" }`
Hi there, as usual your videos are great, time saving, really really understandable not like plenty of articles I could red till now. You didn't use action and action creators, wouldn't be interesting too ? thanks for everything again, Sensei Sama
This is almost the same as Recoil setup. Dispatch as a switch. LoL... just like in useReducer. All inventors doesnt reinventing the wheel. I think i can build my version of state managment.
1 minute of content delivered in 12 minutes
Great Video! I was almost giving up on Redux because of the boilerplate and setup, but useSelector and useDispatch made my life a lot easier. Excellent explanation!!!
What extensions are you using for that arror function that makes the arrow longer and also, fonts are looking awesome and for dark background too.
Please do a tutorial on redux thunk with hooks.
I know im randomly asking but does someone know of a way to log back into an instagram account..?
I was dumb forgot the account password. I would appreciate any help you can offer me.
@Porter Cooper instablaster ;)
@Gerald Jace Thanks for your reply. I got to the site thru google and im trying it out now.
Takes a while so I will reply here later when my account password hopefully is recovered.
@Gerald Jace It worked and I now got access to my account again. Im so happy:D
Thanks so much, you saved my account!
@Porter Cooper You are welcome xD
man you saved my life with these hooks. so clean and easy. watched a ton of stupid tutorials till i reached this one and its so easy to understand. thank you brother i subscribe now. have a great life! petri from romania.
Glad I could help Petri. Thanks for watching!
Thank you for every of your video, you always make it simplified, you make it easier to swallow for the begginers.
I am glad it helped . Thanks for the comment Bojan. :)
Where are actions gone?????
great Tutorial, simple and easy to understand
@techsith All your tutorials, be it HTML, CSS, JS, and now React have been very concise and straight to the point and informative. That's what I like about your tutorials on UA-cam. And that keeps me frequenting to them time and again. Keep doing the good stuff which you are doing now.
And, also I am obsessed with the ending background music. Can you share the source for the same? I tried Shazam but it shows "No results".
The music sounds very pumping and full of adrenaline.
Ashutosh, the end music is actually from youtube's own music library, the name of the track is "still standing". Thanks for watching.
thats great i hardly find that great informative videos abour new apis. Thanks !
I just refactored one of my small apps from using useReducer and useState to usung Redux with this and it was a breeze. Thanks Techsith!
Simple and effective description. Respect everyone time. Thanks!
That's was really a very nice explaination n the thing i liked the most when you cleared about useReducer , that it's not a redux thing. This was the thing I wanted to clear out.
Not sure I really like useDispatch({type: ACTION_NAME}); Now need to import ACTION_NAME and also know the keys that need to be given to the object. WOuld be better if we could combine useDispatch with action creators somehow.
what a great toturial just in 12 min,Thanks man you gave me wings to fly by redux in a short way
Very clean-lucid react-redux sofar. Thanks.
Thank you for doing this tutorial. It's very easy to understand.
To the point and clear,, u saved my time
Good to hear that it helped. Keep up the good work Kareem.
Awesome tutorial... I think I'm beginning to catch up... lol. Its the first techsith tutorial I walked into, already knowing everything that would be covered (because I have already started using these hooks in ongoing projects). Thank you Techsith
None, Dan Abramov has declared darkness a new standard.
Abramov has spoken.
Lord Abramov
Sith agrees that Dan has moved to the dark side. :)
@@internet4543 they mixed it,
they mix the container and component
@@internet4543 lol
what's the music at the end please ?
super easy to comprehend, kudos for that!
Glad you got it Haidren. Keep on learning
great explanation..any cons of doing it this way compared to the older way?
Awesome tutorial as always
Thank you! Cheers!
tahnk youi very much, it was a nice explanation of a minimal redux :)
I stayed for the joke, I was disappointed, I learnt a lot on the way to the joke, thus I am satisfied, great video thank you!
One of the most common thing which most of the developers lack is the habit of not reading the documentation provided by the concerned tech... And the youtubers take advantage of that, they do read the docs well and present the same in their videos and we simply applause them... And by the way I am not an exception, I too do the same mistake😂😂🤣
Thanks for this video, when I worked with redux previously I felt like what the hell is this now too cool.
Yes hooks are cool
Very useful. I've been few days reading the Official manuals from Redux and I couldn't see if they useDispatch and useSelect actually replace connect functionality or not.
Many thanks, clear and concise !
Thank you! but what about actions?
Awesome video sir.
Do we still have combineReducer in newer versions of React?
thank you man that was a nice intro to react hooks do more we are waiting for more
Great video ! Covering all the necessary basics !!
Simple and to the point. 👍
THANKS MAN YOU ARE A KING
So easy to understand. thanks!
Wow. This is great. nice and simple
These are amazing updates!
Thank you for the video!
wow this is a lot easier than the old way of doing redux!
Nice explaining and good joke. Thanks!
Glad you liked it!
thanks!! great, clear understandable explanation
Love that confidence on da thumbnail..migos which way hook way
Very well explained ... thank you
My man you are the best. Thanks a bunch!
Thank you 😄
Thank you for this video
how would componentDidMount work here , lets say you want to do a get request at the time of rendering ?
I love hooks, but I don't think I will be using this for my functional components. I can't imagine any way to make this as nicely unittestable as with `connect`. If you separately export the non-connected component for unittesting, you need can super conveniently inject whatever you want without needing mocking/context etc.
Yes, that is an important question. I dont think its that hard to mock any of this as they are bunch of imports and functions. If you know react-testing-library some nice solutions for that.
please tell which theme you are using
perfect thanks, man. I got what I'm looking for.
Great tutorial thanks
Thank you. It's really useful.
very nice.. thanks for sharing
here we don't need to use connect method right ?
techSith is just pro.thx.
How do you update a multiple field state like "first name, last name, and amount using redux?
the joke is so funny that I forgot to laugh, lmao
hahahah
When did he make joke I don't even find it 🤣🤣
Thanks it helped me a lot
This was so amazing, thank you very much for this!
You're so welcome!
Hi,can i ask you about your arrow? => .... is it ⇒? How to achieve?
Thank you for that great video. You helped me a lot. Keep going and make more good videos in the future :)
Good luck!
I think for those who are using Apollo and Graphql can manage this. But I see Face book and Airbnb use redux yet. I think it's still useful for very long application s with hundred of thousand of components. But I don't know if I really need to catch global state such as a login or sign-up or just still using higher order component with Apollo to pass the token .
great tutorial !!!!!!!!!! very helpful.
Why does lost focus after type any char in InputText ? (I used hook only not with redux)
hey techsith, are you ever gonna have a react course on UDEMY?
I am working on it . most probably will release in JUly . I will announce it.
@@Techsithtube If you can include the interview questions too, I think it will make your course stand out, out of all the react courses.
Thank you very helpful and straight forward!
i have a question, why you didn't define action?
all other document, they still define action in action.js
, but in your video, i didn't see any action, only the reducer
why?
In this video my objective is to simply show the new hooks not the build full fledge project with proper structure for that you can checkout my redux series.
Thanks alot i like it
Thank you very much for your tutorial, it helped me! :D
Nice video. If possible can you make one more video with real time example by using same concept
Change the light bulb? Are we mutating the light bulb directly? How dare you. Of course we build a new light fitting next to it, then destroy the old one ;)
Hi guys, my code is not rendering the value from redux, but on the redux console Im seeing that the value. Do you know why?
Legendary. Cheers!
Thanks for watching Megan :)
never knew who you were until now and i immediately subscribed solely based on your name.
simple and great!
Do we need Redux when we now have Context API with useContext and useReducer hooks ?
Yes with useReducer you cant use async actions like redux thunk . in future react may introduce it.
No you don't need redux. react have all ever you need, and in better approach.
I would say for smaller applications useContext and useReducer will be enough. When your applications grow in size, Redux tooling like redux-logger and redux-thunk come in handy for debugging and cleaner code, so I would stick to Redux for bigger applications.
I didn't mind the joke. great video!
Glad you enjoyed it! Thanks for watching!
Excellent video
Thank you very much!
only just started using react hooks, seems to be going backwards from class components
That was an awsm explaination.
Two, one senior with the state and function and one junior with a changeLightBulp( ) callback.
:)
getting totally confused with, in one hand useSelector+useDispatch and on the other hand useReducer+useContext…….are they the same? when to use one pair or the other? does it really matter when to use one pair or the other??
Pedro, useSelector+useDispatch are actually redux inbuilt hooks. as I explained in the video. useReducer + useContext are react inbuilt hooks they are sort of alternative to redux. It doesnt really matter which on you use.
@@Techsithtube Thanks you so much! good to know, it is more clear now!
What's about the npm install redux@next? What does it mean? Why not just npm install redux?
redux@next basically installs a beta version npm install installs a latest working version.
Im a front wnd intern and we are currently working on a project where we use hooks and redux
.i hope we can use this one ..can we mix this with midwares like saga or thunk?
yes you can mix the new hooks with saga and thunk it should work seamlessly.
I tried the same method in react native app but it gives an error something like this : "undefined is not an object eveluating 'state.counter' " please help me
Can you share your code.
I actually saw your reply late so, sorry for that. and I found the reason for the error is that I was not using the default case which returns the state itself like this
" default:
return (state)"
in switch statement located in my root reducer js file. After solving this issue it worked. that was actually my own problem, and not the problem caused by watching this tutorial. So sorry for that.
can you make a tutorial on how to fetch api data and have it in state, list them and add them to cart, remove, see product info? the simplest way. thanks bro!
Thanks 😊
Hello Sir, you are awesome, thanks for this wonderful explanation, I have few doubts regarding hooks
1. Can we use some hooks(useState) in a class based component?,
2. Since we have this useSelector & useDispatch, then why there is again a new thing useReducer, Is there a advantage over one another.
3. Since we can acheve the store data using hooks, I beleive, we can develop the application completely using Hooks (useState, useEffects, ...), Then No need for Presentational & Functional pattern ? Anyone agree.
4. In the example video, while calling dispatch, you called using arrow functions
onClick={()=>{ dispatch(....)}}, But for performace reasons this is better `onClick={dispatch.bind(this, { type: "INCREMENT" }`
wellcome back to React :)
goddamn thank u for this helpful video :*
now no need of using connect(react-redux)...?
yep , no need to connect anymore. :)
Great!! ....Thanks @@Techsithtube
thanks bro
When i add useDispatch() to a child component as well, I get an error. "React has detected a change in the order of Hooks called by App. "
Ginger, Can you send me the code , So I can take a look
useCallBack hooks should help you to avoid re-rendering
How many React'ers does it take to screw a light bulb? ...................there was no light all this while?
Hi there, as usual your videos are great, time saving, really really understandable not like plenty of articles I could red till now.
You didn't use action and action creators, wouldn't be interesting too ?
thanks for everything again, Sensei Sama
This is almost the same as Recoil setup. Dispatch as a switch. LoL... just like in useReducer. All inventors doesnt reinventing the wheel. I think i can build my version of state managment.
appreciate all your videos, can we make vdo on shallowequal thing in react ? it would be helpful.
no link to the repo?
Thanks )))
Welcome!
how to use redux thunk with hooks now ?