Redux For Beginners | React Redux Tutorial

[@TonyyStarrkk1994]

I watched so many different tutorials, and even bought a Udemy course before I found this video… no one explained the core concept in a simple way, they all just jumped into making a million files and doing things out of order. You helped me finally grasp this, thank you so much!!!

[@nalathomas6340]

i know right

[@Ctrlshifti]

Exactly

[@zNeoDev]

Yup same here

[@worldclasscode1847]

Yes, I have already forgot all about redux. Did you try Use Context + Local Storage?

[@mocoebabymom]

which udemy tutorial if you dont mind telling?

[@신동규-e8g]

The easiest explanation about react-redux I've ever seen

[@dreams-do-come-through]

Exactly!

[@alexandergroshev3991]

first time i started to read about redux was like a: "What a hell, so complicated!" ))))

[@cicciopasticcio8469]

Can’t agree more

[@atasuki37]

So true!

[@kavindesivalli]

I know, right. I tried watching so many tutorials but none made me understand the concept properly

[@Sabrina-dx5jc]

TIMESTAMPS 00:00 Introduction 01:41 Overview of app 07:08 Initialise app 08:46 Setting up with Redux only 08:54 Store 09:57 Actions 10:47 Reducers 11:22 Dispatch 19:27 Integrating React-Redux 23:05 combineReducers 27:35 Redux DevTools 30:54 Hooking up to app 32:04 useSelector hook 34:49 useDispatch hook 38:12 Adding arguments (payload) for Actions

[@ThreeCrowns]

You forgot the goodbye song

[@run_down_mid8480]

Thank uu so much

[@Mhand]

39:35 Goodbye, my lover!

[@ahmedjguirim7237]

thank you

[@monikan9854]

Thanks

[@saffwanqamar5849]

How did this guy teach everything in 40 minutes that people aren't able to teach in 40 hours? Absolutely amazing.

[@bioshazard]

Because pedagogical talent like all talent follows a Pareto distribution

[@Gnnesh]

@@bioshazard 🤔😕

[@bioshazard]

@@Gnnesh in other words, very few people are extremely talented and put almost everyone else to shame. That is true everywhere including teaching.

[@kempisabel9945]

the part 9:50 - 19:25 where you explain store, action, reducer, dispatch was so useful! can't wait to use it on my project! thank you so much!

[@romanazeem3098]

"If you can't explain it simply, you don't understand it well enough". You made my day bruh...

[@stephanpaul8954]

I want this on my wall like those motivational posters that are all black with the white text

[@siddhantraj5323]

this line hits

[@JenniferStewart100]

After having a meltdown and damn near crying after my coding schools React assignments... I came here and in 30 mins understood way more than 2 days of two-hour lectures. I like how you speak in lamens terms... maybe thats all I needed.

[@dylanlee9176]

dont cry, just add me on facebook i'll help you :D

[@meerestiyak9483]

@@dylanlee9176 haha

[@sofiachaves2575]

the fact that you learn react in your school is what is making me cry, in my school they only taught me C, C++, Flash, HTML and CSS and that was it... xD

[@farban6200]

fr lmao

[@kyrianmolokwu8306]

@@sofiachaves2575 you guys learnt this in school??

[@maximoarauz8115]

2 years since the creation of this video, still the best and cleanest explanation i've seen

[@felicitya.9077]

Can I just say ' I love you dev ed'. First, you taught me context API and when I was ready to go further, you are still here to teach me redux. Hey youtube, someone deserves a consistency and simplicity award

[@idevbrandon]

13:00 action 14:00 reducer 16:30 Dispatch 19:40 react-redux start 23:12 Hook the reducers into our store & combine all reducers 31:00 interact with React Redux 34:50 modify the counter with increment/decrement

[@cherniaev]

One little thing for the beginners: instead of using a ternary operator for conditional rendering at 34:40 it's preferable to use { isLogged && Valuable Information... } according to React docs.

[@m3rl1on]

huh, i've never used conditional rendering like these. will try to use this later

[@d3struction61]

I prefer it this way, even without the documentation :D

[@rudeadyet1992]

doc's link, please.

[@cherniaev]

@@rudeadyet1992 Here it is! reactjs.org/docs/conditional-rendering.html#inline-if-with-logical--operator

[@bengrandin2646]

Could also simplify arrow function when returning object by : export const increment = () => ({ type:"INCREMENT", payload:5 }) instead of export const increment = () => { return ({ type:"INCREMENT", payload:5 }) }

[@ScopedMach1ne]

"in case you’re ever going to get hired" ..... lmao that hit deep!

[@SpamFreedom]

@@virtumind where are you located and are you for real 4 years lol?

[@ThePaullam328]

@@virtumind oof what's your area of expertise and what projects have you done... I supposed you have already done 40 projects in different frameworks and languages

[@virtumind]

@@ThePaullam328 yes I used php js nodejs reactjs C# Delphi

[@ThePaullam328]

@@virtumind if I were you having those 4 years, I would have branched out to Kotlin/Swift mobile dev, C#/C++ game dev, Python data analytics, machine learning, etc., instead of just sticking to very limited options... for web dev as well there are sth like JQuery, Vue, Angular, and you can even try WordPress... Btw use some very up-to-date languages instead of sth that nobody uses nowadays like Delphi if you wanna get hired.

[@virtumind]

@@ThePaullam328 react node php has very high demand. I went to several interviews 70% are very hard to pass and the rest that I passed, HR did not replay to me later. Some companies want the developer to beg for a job. Any way my location is my prison I can not find a way to relocate.

[@developedbyed]

I am delaying the Vue video until Vue 3.0 drops so we know 100% what changed. If you want to see redux thunk I will add it when we build a project so we can see a practical use. Thanks for anything and your support on Patreon!

[@mhdyousuf3392]

Dev Ed Ok.. appreciated it

[@drenkarvet4768]

Thanks , keep up the hard work 🖤

[@Somsubhra_Das]

Please do redux-thunk too.

[@Somsubhra_Das]

@Rakhimbek Berkinbay there are many alternatives. ContextAPI is provided by default in react. You don't even need to install any extra packages for context API. Also easy peasy state manager is there.

[@munyetech]

what program you editing your video and screen recording please

[@ice_tee]

The video is neither very short nor very long. Completely on point. Thank you so much !!

[@syedkalam5781]

Glad to watch your coding sessions, This is a very detailed,focussed and real-time explanation. The best part is that you make us feel easy about the topics. Keep up with the laughs and the smile! haha.

[@vicliur2]

Thank you, you are one of the rare KZbinrs who actually goes and explains the concept rather than just doing it.

[@geoffreyhoffman4261]

Ed, you're the man! In 40 minutes you just made sense of something I've been trying for 2 weeks to understand. Thanks!

[@nativetube]

Lol redux is damn easy, you're just a kid got excited to learn something something pretty hard easily for the first time. Chill

[@geoffreyhoffman4261]

@@nativetube I'm 35... If its so easy, why are you watching tutorials. And how bored are you that you're trolling 10 month old comments. Why throw shade for me showing gratitude to Ed for putting together a decent tutorial? Get a girlfriend and move out of your mom's basement.

[@skyro6138]

@@nativetube Imagine being so insecure about your programming abilities that you have to go around downgrading other people for learning new concepts. Absolutely pathetic.

[@kuronakajima9645]

This comment section went south so fast...

[@kumargourav7065]

@@nativetube dear if u think u r so intelligent and don't need anyone help then what the hell u r here up for.... And I m pretty sure you don't know redux properly... U just saw this video and then u are thinking u r an hero then u started bullying... Dear everyone have right to get educated and can study....

[@mdintekhabshaukat3941]

I am complete beginner to react and redux, however, I could understand the concept and code. Nicely explained. Well done and Thank you.

[@birajpokharel7278]

how is your react skills now?

[@birajpokharel7278]

@Azizbek Xushnazarov i have 9 months 😂

[@birajpokharel7278]

@Azizbek Xushnazarov yes

[@dashayankovsky8323]

After all the struggles, finally the best and the easiest explanation of Redux! Thank you so so much!!! You are a great teacher!!!!

[@thomastilahun9272]

I had a lot confusion about Redux entire lifecycle, honestly speaking no one explained like this before. Thank you so much!!!

[@cobalt0s]

Give him a medal! This is great. Simple and everything to the point.

[@dreams-do-come-through]

T h a n k y o u ! - The first tutorial I've seen about Redux where I really got the impression that the tutor ACTUALLY INTENDS to help people understand Redux. My experience is that many people who make tutorials seem to have a lot of thoughts in their head about showing others how smart and fast *they* are, and they seem to forget a little bit that they are actually trying to help *others* understand some new or difficult concepts. I personally appreciate everybody's effort who teaches others something, but it's so beautiful when someone is able to do it very well. Please, keep doing what you are doing!

[@aammssaamm]

Most likely they don't understand what they explain cause they look like they memorized somebody's instructions and thanking god for nobody there to ask them a question.

[@thecodetoad6098]

Great comment. I've been one of those "let me show you how great I am" guys for a long time. It saddens me to know how many people I might have made feel insignificant with my behavior. The Universe made sure to knock me down to a point where I could finally see the consequences of my actions.

[@trevorallen7554]

this x1000

[@scriptkeeper8243]

Truth is they don't understand it themselves.

[@psycodeveloper9001]

I usually don't comment on tutorial videos. I just watch like and skip. But this one was a different one. The way you explained it was really awesome. You made such a huge topic soooo easy to understand. This one is the best tutorial on Redux which I have seen till date. Thanks buddy, you are really a great teacher. Keep going. We will keep supporting... 😍😍😍

[@Amelie_Dubois]

I just started my second ever tech job and my supervisor wants me to learn Redux. I had never heard of it before so I came to KZbin to find some videos that would help me understand it. I watched a few videos and nothing made sense to me until I stumbled upon your video! Thank you so much for this!

[@SulferDragon]

One of the most concise and helpful tutorials for any programming concept that I have ever seen.

[@Somsubhra_Das]

This is the best redux tutorial I've found till date 😍😍😍

[@P2WFosraken]

Finally, I see the light at the end of the tunnel! Thank you so much!

[@ryansamarakoon8268]

You finally helped me understand how to use redux, no other tutorial out there breaks it down as well as you did. Thank you!

[@rajatkinlekar290]

Bro I watched like almost hundreds of tutorials on redux and you were the one who made me finally understand it. :)

[@therealblackgold]

All your videos are gold this one was no disappointment...definitely the best redux explanation on the internet.

[@SomeRandomNess4]

Hey Ed! I really appreciate the fact that you get into these topics with so much positivity on your face. Keep up the good work!

[@high-oncode7576]

No one would say redux is difficult to understand after watching this. Dev Ed❤

[@nicholasmamali2704]

bro this guy is great

[@worldclasscode1847]

I say: It's difficult. Especially since I think it does not solve any of my problems. That is: 1/ Distributing state in a simple way, 2/ Persistent state in a simple way

[@OhmVibe]

This really helped me to wrap my head around Redux after struggling with the basics for a while. Great visual explanation of the concepts.

[@aammssaamm]

It feels like redux creators also struggle a lot to come up with such a mess 😂😂😂

[@Oxygen.O2]

I speak french, and there is various tutorial in my language, but there is nothing that come quite close to your tutorial. It's crystal clear, thanks!

[@onax1]

Just about the easiest explanation of redux I've seen. Thanks Ed.

[@demetriuscyprian8368]

To be honest, this man helped me a lot to become a developer! Thanks

[@xiaoyuchen9731]

Love this redux tutorial, very easy to follow and understand! Dev Ed could always know what really hinders us and help us get out of that in a very clear way!

[@brazybenjamin2937]

we just started learning redux in my bootcamp and when I heard about actions and reducers, etc.. I was so lost and confused, but this video really helped me understand redux much better. Thank God for you, I appreciate you so much man. 👍🏻

[@yonathanhailemelekot5238]

The hooks part is so amazing.

[@prasadwakle2462]

I wanted to learn Redux and I watched many redux tutorials, none of them explained Redux in such an easy way. Thank you so much.

[@millertime6]

omg, i love the high-level overview in the beginning! Just diving into the code and jumping from file to file is so confusing!

[@carsontrinh414]

Really great explanations! I like that you explain things repeatedly and highlight certain points that reduce how magical redux feels sometimes

[@worldclasscode1847]

Redux = dark magic .... or nice magic? :)

[@AiwwwA]

This is the best explanation. Dude knows how to explain complicated things 🤟

[@syedahmadarshad3711]

For someone who is new to Redux, this is perfect. Simple and concise.

[@adityakadam2256]

The most straightforward and simple explanation of redux on entire KZbin. Thank you very much.

[@meganadams]

This gave me the 'click' in my brain that I was hoping for... Thank you!

[@LiteraryLad_824]

same. been avoiding redux for months because of the initial wtf moment i had when first learning it. this helped.

[@Blure]

Could you consider making a tutorial of a real world app in React? Thanks for sharing your knowledge. Kind regards.

[@bugwriteryang8038]

+1

[@kefamutuma7402]

counter ++

[@ChrisTarasovs]

I will be creating one tomorrow. Also a comparison between Angular and React :) as the way you implement is very similar

[@kefamutuma7402]

@@ChrisTarasovs great.. looking forward to it..

[@ChrisTarasovs]

Here you go guys, kzbin.info/www/bejne/aoSTdX-QgLN3d80 Sorry it took me so long, I was ill :(

[@lovegovindasat]

Great video! I recommend calling the 'reducer' an action handler. Thank you!

[@aammssaamm]

it's actually a sync event handler.

[@ericmakuza7449]

Man u should be given an award for this one this is the best redux tutorial out here

[@Min.Scepter]

Why didn't i discover your channel all this while. I have wasted so much money, time and effort on tutorials that got me confused the more. You a life saver, such a wonderful tutor. Your channel will be on my top list. Thanks.

[@martinbozinovski]

Such a good explanation. I watched a Udemy course with a whole app and it was knowhere near this explanatory. Sometimes we need to do just baby steps. Nice work man, really nice work.

[@FerminArellano]

Great tutorial! At first I didn´t want to keep on watching it since you said you didnt like Redux. But even though you dont like it you still did an amazing job at teaching it.

[@Zaizen-r8e]

I was in trouble to understand Redux in my work. But this tutorial helped me a lot. Thank you.

[@worldclasscode1847]

Do you use Redux today. I use Context: kzbin.info/www/bejne/i5bbkI1ueLF7qcU

[@MickenCZProfi]

Thank you SO MUCH! Even though there are new ways to operate Redux nowadays, this 3yo tutorial was the only thing that did it for me, now I finally understand it. You're a life saver, thanks!

[@rio45214]

I've been watching tutorials for several hours now, none of them were as fun and helpful as yours. Thank you so much 😭

[@tarekfathi2003]

you are a wonderful instructor. Amazing explanation for the complex and complicated Redux library

[@xoxoo4877]

Thank you! I really appreciate when someone "nuclear physics things" made understandable in such an easy way.

[@Mo_sch2001]

I can't describe the much of love that I have to you , you literally made my day bro👌♥️

[@brandonwie4173]

I’m here to refresh Redux concepts for my assignment and interview for my first job and indeed Ed you’re amazing. Big thanks in 2021.

[@westm1839]

I’m a current SWE but I know way more about devops and infra than web dev and I *immediately* subbed this channel from the moment I opened the vid, I love your personality and the humor you bring to explaining stuff!

[@KyleSmith-qs1if]

This video was perfect timing! Appreciate it man

[@imhrsh]

the ending is awesome dude. !!!!

[@T-Show.]

It's nice to see that Juventus' Aaron Ramsey spends his time off teaching people how to code.

[@sweetech4087]

Lol .. thats true

[@sogenohata1948]

So easy to understand. I was truly a beginner at this and yet I understood. I also just love the energy and humor of Ed!

[@harishvenkatesan8751]

This man is the best for redux tutorials I have watched a lots of tutorials for redux but nothing is as simple as this Great job

[@nivaech]

Every attempt of implementing Redux into my app finishes with implementing React Context :( Thanks for the video. Gonna dive into it once again.

[@worldclasscode1847]

React Context is perfect. Specially if you combine it with Local Storage and Use Effect Hooks, like this: kzbin.info/www/bejne/i5bbkI1ueLF7qcU

[@denns0r]

oh my god, that was such a good introduction!! thx a lot

[@douglaslombard5616]

greetings from South Africa, thanks for the vid

[@lowercasegoon5231]

Am from south Africa too

[@poonejabbari52]

Thank u soooooo much for this simple explanation. I had watched loadssss of videos and couldn't really get hold of all that. Now i can skip the Redux module of my course

[@dhruvishabansal2652]

Was so confused about redux, you made it understandable in the simplest manner. Thank you so much :)

[@shivanigaddagimath6105]

Hi Dhruvisha! Are you a student or working currently? Would you be interested in exploring a job opportunity in web development?

[@dhruvishabansal2652]

@@shivanigaddagimath6105 Hii, I am a student and interning with a company at the moment. And I would like to explore the opportunity. Thank you 😊

[@shivanigaddagimath6105]

@@dhruvishabansal2652 Great! You can get in touch with me using the information on my channel. Looking forward to hearing from you!

[@namphuong8828]

greatest explanation i have ever seen, tks bro

[@animexanime2566]

Teachers: i am explaining everything to you Me: watch this video

[@LeaDClan]

So cool. Could you provide a video wirh Firebase Auth / Collections in a React Context? I‘ve seen some videos but your explanations & style of doing videos suits me better. :)

[@worldclasscode1847]

Yes, I have a video with Firebase Auth / Collections in React Context... :) kzbin.info/www/bejne/i5bbkI1ueLF7qcU

[@twinklegoyal2239]

Absolutely amazing, no one explained the core concept in a simple way, they all just jumped into making a million files and doing things out of order. You helped me finally grasp this, thank you so much!!!

[@akinfabunmi8186]

I really can't say much but just 10 mins into this video, I grasped so much what almost 2 hours of some other videos couldn't give me.

[@barjuandavis]

Imagine spending 30 minutes only setting up a counter redux store while Context API only takes a few lines of code on App.js 😂

[@bagup_alpharetards]

Not few lines. Just a single line to call the Provider Component having a global state and than wrapping every other component inside it. if I'm not wrong

[@aammssaamm]

@@bagup_alpharetards it can be easily automated. Writing this mess by hand is a choice not a necessity.

[@worldclasscode1847]

Yes, Context is a line or two. And we can easily make context persistent, to survive a browser refresh, like this: kzbin.info/www/bejne/i5bbkI1ueLF7qcU

[@Breezbriznost]

I spent 10 minutes of my life trying to know why the code wasn't working, turned out I forgot to put () in the dispatch(increment()) part.

[@Jensensjyde]

thankk you :)

[@thissohil1166]

And I spend 10 hours! :(

[@jonathanperez8404]

Oh my god you saved me

[@arslanahmed5137]

"If you can't explain it simply, you don't understand it well enough"

[@Seacrest.]

The best redux tutorial in entire YT actually. No native russian guides anymore about programing stuff. Thanks for explanation

[@marwansalah4910]

I like that you are organized and really impose a specific coding style that makes it look easy, thank you sir!

[@unknownman1]

Error: Reducer "counter" returned undefined during initialization. If the state passed to the reducer is undefined, you must explicitly return the initial state. The initial state may not be undefined. If you don't want to set a value for this reducer, you can use null instead of undefined. wtf am I doing wrong?

[@unknownman1]

I found the soulution. I'm surprised that how no-one pointed out this error. I guess people here in the comments just watches the video without trying the code on their own. Anyways, if you also face this error just add default statement to counter.js switch case. const counterReducer = (state=0,action) => { switch(action.type){ case 'INCREMENT': return state+1; case 'DECREMENT': return state-1; default: return state } } export default counterReducer;

[@ayaanqui]

@@unknownman1 Thanks man, I got the same error and was unable to find a solution

[@permanar_]

I mean he explicitly explained it in the video, but he just doing it in the loggedReducer (and I assume you already see the whole video without skipped anything). And you can just did the same thing for counter.

[@syedimam1998]

i have a doubt how it is linking increment/decrement action to counter reducer every time and he have not explained about the logIn and logout action.............. what if there are 2 different reducers both of them need increment and decrement actions, while in dispatch he haven't mentioned the reducer he is passing then how it would differentiate. that which reducer would get the increment/decr........

[@vasanthakhila]

only a great man can make and explain complex things much simpler. .. you are really great . words cant express my gratitude

[@raamch]

It’s 2 months I am searching for a better video and now I found this. This is the best lesson on React Redux. #reactredux #reactjs #react best tutorial. You’re a awesome. Thank you so much.

[@vaibhavagrawal6770]

Great and easiest explanation. The best part is your video's are never monotonous or boring. Thanks Indeed

[@arumih9998]

Thank you so much! I was confused about react-redux and you fixed all the problems! You won a new subscriber ;)

[@ShaliniNegi24]

I really love how happy/ cheerful you are while teaching this clearly reflect the joy which you get while teaching. Thank you

[@missphantomhive2796]

This video was a life-saver!! I was trying to make sense of Redux for past few days!

[@mart1127]

Hey my gorgeous friend Dev Ed! I am now working as reactjs dev because of your crystal clear tut. Thank you so much!

[@massarde9591]

There are a ton of really good creator in KZbin. and I mean really good ones. but Ed is the only one that I can sit here for hours and don't be bother to death. I find your videos extremely easy to follow , very entertaining and on top of that your videos are very consistent. One of the thing I hate in other creators is they say "beginners" then they start "let's create an increment button" ..then 15 min later... "ok now we are creating a full "netflix/facebook/youtube/google style code" ... and I am like... wow wow wow that was a func*ing jump -.-

[@jessica_tee]

Been trying to wrap my head around Redux for a day or so now and its just not sunk in, this tutorial has made things SO clear :)

[@wikhan2002]

It's so organic way of teaching. I love that. You made my Redux day. Thank you so much.

[@tithonus8962]

Easiest explanation ever, saved me from my class project. Thxs

[@SirGustav]

You just won a sub. The explanation was so smooth and dynamic even tho you said you don't like Redux. Kudos!

[@Zen-lz1hc]

I am was learning redux, and it was brutal, I got sad, I got lost... Then I found your video, and put a smile on my frowny face... Thank you for bringing some hope and light to redux. Thank you for bringing some light comedy to the software development trenches :) You are my hero today! :)

[@rishikesh3163]

You and Kyle(Web Dev Simplified) are the best teacher i have ever seen in my life ❤❤❤

[@AdrianSanchezq]

You spent the entire video saying how complex Redux is but somehow explained it in the easiest way ever. BOSS

[@chaitanyaj4877]

I came to you for learning Context API & now again for this. You're the best, Man!

[@am25deek]

For months I didn't get redux. I thank the Lord that I found your videos. Please be encouraged brother.

[@spaceghost7807]

I watched this whole video and you made my day! I just finished a bootcamp, and I wanted to learn Redux to aid my React. This vid was just what I needed and it all made sense! You're the best! :)))

[@chilledsam3025]

Really a clean tutorial. Simpliest. You should have a full REACT tutorial. Loved it