React passing data between siblings

In this tutorial, you will learn how to pass data between siblings components without using any third-party library.
In React you can pass state as props to the child components but you cannot pass state between sibling components.
The best solution for this can be wrapping both siblings in a parent component and handle the state inside the parent component. Then you easily can share the state between any siblings that you want and use the state inside the child components.
Hope you enjoy it!
You can download the project source code from here: pezeshkzade.com/blog/source-c...

[@ReactWithMasoud]

You can download the project source code from here: pezeshkzade.com/blog/source-code/

[@geezer74]

Oh MY GOD!!!!!! You are incredible!!!!, I have searched days and hours for this to no end!. This has to be the greatest solution ever!!!!

[@abigailfolarin5876]

This is really helpful and concise. Been trying to figure this out for a while to no end. Thank you.

[@juandiegoalbino6079]

this is pure gold, thank a lot! spent 2 days all over internet without success.

[@sayantanchakraborty2126]

Thanks a lot for this video. I nearly spend an hour to find this exact video I need to solve my problem.

[@FromHeavenBaby]

I did a lot of research about this but this video made it clear. Thank you!

[@gabel7323]

This explained easily, what, for some reason, took me way too long to get. THANK YOU!

[@JoaqoCR7]

Wow, super clear, I was reading articles about this but your video was the answer I needed, great one, new sub

[@Hustada]

This helps explain a lot of what looked like magic to me initially. Thanks.

[@chedic8466]

Beautiful, this helped me learn how to pass information for a modal. I simply can't thank you enough :)

[@for41]

Man, you saved my sanity. Love from Austria. Thank you very much!

[@ReactWithMasoud]

Great to hear!

[@michelpomerantzeff1749]

Thank you so much Masoud!
I was struggling so much trying to exchage data between siblings and your video helped a lot !

[@rishabhsinha3713]

React is just ❤. Thanks for the explanation.

[@beckyb9215]

Thank you, Masoud. You are the legend.

[@alejadiaz5]

6 hours trying to do it, then your 6-minute video saved my life

[@ReactWithMasoud]

Glad I could help!

[@EugeneVe]

Thank you, this really helped me, I've been looking for this solution for a long time. I am new in react, so this is a great tutorial.

[@ReactWithMasoud]

Glad it helped!

[@maskman4821]

wow, this is a pretty awesome example demonstrsting pass data from component to sibling component, good job !!!

[@ReactWithMasoud]

Glad you liked it!

[@r_majka]

That is exactly what I needed :D Thank you a lot!

[@vlad_dimov]

Thank you, this was very useful! It helped me achieve what I needed 🙂

[@axeld.santacruz4659]

Man, you're a life saver! Thank you!

[@ReactWithMasoud]

Glad to hear it!

[@MALIWAL1000]

Just what I needed, thanks!

[@crazeislive_cil]

Thanks buddy, You absolutely deserve sub. I am your huge fan. It is gonna award me some bonus from my client.

[@ReactWithMasoud]

Awesome, thank you!

[@kreddy241]

Thank you so much for this. Extremely helpful.

[@ReactWithMasoud]

You're very welcome!

[@SoraFromIndia]

Man you are just awesome awesome 100x awesome dude.. subscribed for life XD.
Edit - you the best! God bless ya and your family! XDXD

[@alexbarasa3816]

So well explained. made it seem so simple.

[@quanghopninh3376]

holly. thank you so so much. you helped a beginner like me. thank you, got my subcribe

[@jiazhengliu2137]

Thank you so much! Saved my life

[@camels_are_sober]

excellent explanation ! Thank you

[@TomRadic]

you saved my day and nerves

[@cryptoswithpotential181]

very useful and simple. thanks a lot

[@alessandrospiridigliozzi7943]

very helpful!!! thanks a lot!

[@milzdechnik846]

Thanks, this was super helpful ❤️

[@HARDY4006]

Thanks a lot , this really helped.

[@samuelcorpuz4954]

Thank you it help me a lot in understanding userState passing

[@aminatmoldalieva6385]

Jazakallahu Khair it is sooo useful

[@bhavykhatter6375]

Thank you much Bro!

[@erwindemata6439]

Thank you! it helped me :)

[@subhradeephalder9737]

Extremely super logic.

[@parimalpatil0709]

Just keep it up bro 😘😘😘👌👌

[@zambumm]

nice, saved my day

[@amitbt69]

Great video!

[@anikkhan8811]

Wonderful man!!Keep these vids coming. I am smashing the SUBSCRIBE button, you deserve it :)

[@ReactWithMasoud]

Much appreciated!

[@lucasgaudio9016]

Thanls man, this help me a lot!

[@ReactWithMasoud]

You're welcome

[@saadeddyneelabdari455]

it's really helpful thanks a lot for this simple explanation

[@ReactWithMasoud]

Glad it was helpful!

[@nargizgasanova6222]

thank you veryyy much!!

[@victoria320-49]

Thank you!!

[@linyerin]

Very helpful.

[@imthiyazmuhammed2517]

thanks, dude

[@dotsona07]

How would I pass props to the home component?

[@anuruddhabandara2071]

Thank you :) keep it up

[@chocinspired]

Interesting use case

[@kiproth]

thank you so much

[@isEriCafe]

what could I be doing wrong, if it works with the first click but the next time I click the button it doesn't update?

[@ankitmehrotra8519]

Helpful video..

[@ZeyadMohamed-uj5pn]

good idea

[@masihasam5994]

very thanks Masoud

[@dvnypacino]

thanks big boss

[@amrad2324]

Thank you keep it up

[@justchill9474]

If animate is not there... Then when can we give... selectedMode?

[@AN-ox7sb]

but if I understand correctly, this will cause the app component to render all of its child components, so in this example, the sidebar will render every time app.js state is change, what if I want to render only the home component?

[@ReactWithMasoud]

It is better to use redux and always try to keep your state in the component that you want to be re-rendered!

[@gauravyadav2475]

superb

[@MrAmrmnabil]

Thanks

[@mohammadmahdialvansaz8001]

thanks

[@A__Singh__]

Well explained/

[@jacsdev]

Nice

[@stephanieegbuonu2626]

I want to know how the animation works

[@live_emulator]

thank you thank you thank you

[@ReactWithMasoud]

Any time

[@sabareeshsk1326]

thank u so much

[@ReactWithMasoud]

You are most welcome

[@hola9technology610]

Not working it says 'setSelectedCat' is not defined

[@aslampathan3066]

link not working

[@enmanuelruiz544]

This is a really good tutorial, but if you try it in React typeScript, it going to give u some errors.
1. You'll have to specify the parameters type as any
2. Pass the function setState is not going to work .

[@ReactWithMasoud]

Yes, for typescript some additional work is required but the concept is the same.

[@bobba0385]

whats the fix for the 2nd one pls i need

[@maskman4821]

how come you didn't push this project to github for people to download and learn ???

[@ReactWithMasoud]

Since it was really simple. If you need it I can push it now

[@maskman4821]

@@ReactWithMasoud yeah, that would be great, please push it to github, thank you very much !

[@ReactWithMasoud]

@@maskman4821 Sure, I will

[@ReactWithMasoud]

Source code added.

[@maskman4821]

@@ReactWithMasoud thanks a lot, man !!!

[@random-user-1337]

Thanks

[@alukret]

thanks