Learn React Redux Toolkit with Project in 2 Hours | React Redux Tutorial for Beginners

[@bigsidetech]

Giving 5+ stars 🌟 to this video for covering the below points: - Folder/App structuring - For react routing. - For extension: Reactjs code snippets. - rsc - Cleanup in useEffect for movie detail - Reduxtoolkit middleware & extra reducers. - For useParam hook from react-router and its usage. - Loading handling for movie detail page. - For Kandi openweaver platform → to find required libraries. - react carousel with a library. - Responsiveness of React carousel. - Moving carousel settings to a different file to make it re-usable. - Search functionality. - For using font awesome and its usage in the search form. - Tip for Loading state for search. - Validation for empty search. - Clear & precise explanation throughout the video. Thanks, Dipesh bro for such a clear and detailed video

[@giafra95]

Dipesh, I rarely watch coding lessons on KZbin because I often find them too boring or dispersive, but I admit that I followed this lesson for hours straight and I was amazed by how clear you were in explaining everything to a Redux noob like me. Before watching the video I had a good grasp of how React works, having already developed myself some small projects, but regarding Redux I only had the theorical knowledge without any coding experience; nonetheless, I have found your video perfect for practicing with Redux concepts for the very first time. Your English is very clear and I have found extremely helpful the coding of the .scss files, this was unexpected but greatly appreciated. The lesson was very concise yet extremely detailed, and the application itself is very interesting. Thank you very much for this amazing video Dipesh, it was by far the most helpful coding lesson I've ever watched on KZbin.

[@23b_namrathasairam82]

Best video on the internet for react and redux beginners. Please continue making more such videos. Learnt a lot

[@DipeshMalvia]

I will continue. Thanks Namratha!

[@DipeshMalvia]

Guys, if the video is helpful to you or you learned something than please appreciate and ADD COMMENT hit the LIKE and SUBSCRIBE button and help this channel to GROW😉

[@astroboy3720]

Just finished, this is one of the best redux video on KZbin, thank you so much 🌱🙏

[@DipeshMalvia]

Wow, thank you!

[@shoukathennadesigns5135]

@@DipeshMalvia your explanation and content is next level .plz make a tutorial on react with webpack setup I'm not able to find the video which has good explanation on it ..plz...😢

[@skskssss126]

thanks man! this was really helpful. By far this is the best video that is actually for beginners.

[@DipeshMalvia]

Thanks and glad you liked it!

[@ChethanK-fd7mq]

Its super clear, keep educating. thank you!

[@rimpysaini4976]

best redux Tutorial && Brilliant Explanation... Thanks a lot Dipesh .. I watched your all react video playlist. now able to create full react app .. thanks for teaching ... doing good ..good job. god bless you

[@DipeshMalvia]

You are most welcome

[@subhamgupta1549]

An Excellent video to watch !!!! Must watch video for redux-toolkit.

[@GowriSankar-mc2uc]

U r a great teacher ever...keep rocking ❤

[@DipeshMalvia]

Thanks a ton

[@shaikkhajamoulali-iy2fm]

U deserve ❤❤❤ brother ,thanks for the efforts and 🎉 for ur passion

[@DipeshMalvia]

Thank you so much 😀

[@mostafasalah6577]

i love you man you are very helpful thank you for this video wait another awesome videos like you

[@DipeshMalvia]

Happy to hear that!

[@RobiulIslam-dn9mm]

thanks. i learned a lot from this video about redux toolkit.

[@nawazishali274]

The best explanation of redux toolkit 😍

[@DipeshMalvia]

Thanks

[@ak_ros]

Thanks a lot Dipesh i learnt a lot from this video, actually this is the video i looking for till now SUBSCRIBED..!

[@DipeshMalvia]

Thanks for the sub!

[@mahammadmansurali7442]

Thank you so much , A much needed video. ❤️

[@daffahanz1540]

thanks for this tutorial, it helped me a lot to understand redux toolkit😁

[@blaslorenzo7906]

hey dude i love your videos, are really helping me!!!!

[@DipeshMalvia]

Glad you like them!

[@AjayKumar-id7mb]

I really like your especially 1 hour video. All the main concept are covered in 1 hour.

[@muhammadshahnawaz700]

Thank you so much for this amazing video. I was struggling in a similar project and this video solved my every single query. Thanks man. LOVE from Pakistan 😍😍

[@DipeshMalvia]

Welcome ShahNawaz.

[@sajjadkazemi]

Thanks for this really helpful project I learned redux toolkit from this 🙏🏻❤ For the developers who can't deploy their projects on netlify or something with this api , you just need to change the base URL protocol to "https" and that's it.

[@thiyagum8649]

did you deploy this project? is it working after deployment?

[@sajjadkazemi]

@@thiyagum8649 yes sir its working well

[@AyazKhan-hn1ee]

nice tutorial highly recommended A kind request can you create a more complex project using redux-toolkit

[@DipeshMalvia]

Glad you liked it. Noted your feedback.

[@prakashsubedi9980]

Thankx for the detailed explanation on the various topics. At this day, the ''Link' of the react-router-dom version 5 didnot work for me (don't know why, has worked in my previous projects). So, I had to change the react-router-dom to version 6. But, the video is informative. Thankx! :)

[@prakhardhyani7111]

same bro ..!!

[@kirakira160]

Omg! You are the best!💪💪

[@DipeshMalvia]

Thanks!

[@abch6598]

Thank U so Much This tutorial is Helpful ❤❤❤❤❤❤

[@ИльяДрон-х2й]

Thanks, You're the best !

[@vhsphshbs]

It was great. Waiting for more depth on this

[@DipeshMalvia]

Sure thanks!

[@Jindagi_Life]

Excellent

[@DipeshMalvia]

Thank you! Cheers!

[@pedromanuelcamargomendez6520]

Excuse me, this video is old, react-router-dom change version 6.2.1, but is cool, thank you, this is a great video.

[@DipeshMalvia]

It's is combined single video. I know the react-router-dom v5 is used.

[@YourTechWhiz]

Thanks for the video.❤️ Your new subscriber from Pakistan.

[@harshilgandhi4397]

Hey Buddy! Brilliant Explanation! Its quite hard to search a practical project explained in so much excellent way! understood it fully! Really heads up to you! You are explaining in such a clear way! I listened it in 1.25 x speed! Thank you so so much for adding this video! You actually inspired me in correct way to use Hooks rather than Class components and use Redux Toolkit! Thank again! :)

[@saudkhan1080]

More Redux projects plz waiting

[@kevin-xr1wf]

A perfect tutorial with live errors solving

[@slmshady539]

Bro ye toh maine dekha hai... But anyway to those watching it for the first time. Go for it, it's amazing

[@DipeshMalvia]

Thank you so much 😀

[@bhushanwagh2163]

very informative thankyou

[@tantangunawan8807]

Wow, thanks for your video sir, this is great 👍👍 ..

[@TheWorldlife83]

Very helpful video, thank you...@42.07 it should be Immer

[@balachalla9049]

excellent sir.........

[@DipeshMalvia]

Thanks Bala!

[@thiyagum8649]

did you deploy this project? is it working after deployment?

[@imkir4n]

Wow perfect time to learn Redux 😀

[@DipeshMalvia]

Awesome!

[@nhgghnbfjjbfe]

If you are getting this error - 'Switch' is not exported from 'react-router-dom' (imported as 'Switch'). Use Routes instead of switch

[@prabumani]

Thank you so much sir

[@DipeshMalvia]

Welcome!

[@shohagkhan3677]

Thanks for the complete video. Have you ever used zustand for global state management? Really confused, what we should use, zustand, Rtk Query, React Query, SWR which one is good and why...🤔

[@DipeshMalvia]

Haven't tried zustan and SWR yet but I will have a look on them.

[@ladydidi8725]

You're awesome!

[@realtorBG]

awesome man

[@DipeshMalvia]

Glad you enjoyed it

[@imsidrock]

Master Blaster

[@DipeshMalvia]

Thanks Sudhanshu!

[@aniketbhalla1521]

Next.js can fetch the data of shows and movies at build time on server and pass it the props of react component and thus we won't see any delays in data fetching when the page loads for the first time.

[@SagarKumar-db2xy]

Can we build complete full stack app with Next Js? I mean apart from Seo, how Next js helps us?

[@aniketbhalla1521]

@@SagarKumar-db2xy We don't need any State Management Tool, especially Redux. Use of useReducer & Context would work same as Redux. Redux increases complexity levels & sometimes it seems unnecessary. And your answer, yes we can do anything with Next.js. Nextjs helps in easy routing, static page generation at build time, so faster page loading initially. And also Server Side Rendering with getServerSideProps. In that case, page will be constructed every time, user requests for it. Rest read Next.js documentation. Gonna help you.

[@Sm123bg]

Thank you for your video! I’ve struggled with this a lot lately. How relevant is Redux with the shift to server side frameworks like Next, Remix, etc? Is it only applicable to SPA’s? Thanks for any help

[@DipeshMalvia]

Haven't spend much time on NEXT and REMIX so it's bit early for me to answer. Will surely do analysis on this.

[@Sm123bg]

@@DipeshMalvia Good deal! Appreciate the response and hope you able to provide your thoughts one of these days

[@youcan4149]

Please make a tutorial on Next.js with Redux.

[@humtohchutiyehai1016]

Loved it 😀😀😘😘

[@l.seciltuncay7921]

could you please add "add/remove favorites"? thanks

[@phamngocangkhoa1394]

Good video for Redux beginner !. But, I suggest you should remove the React.Strictmode, because it will send an error about the useDispatch method and the fetchMovies.

[@AamirKhan-zy5yt]

I don't find removing a piece of code a good approach. I think it's here for some reason.

[@sundeeep]

Dipesh, If you would added the Firebase Authentication Slice as well, then this video will be the best explained and useful video in this world!

[@tkot7857]

3:00 11:46 (done) 16:14 (done) 32:24 (done) 45:00 (done) 1:01:45 (done) 1:17:20 (done) 1:25:00 (done) 1:33:00 (done) 1:39:07 (done) 1:42:00 (done) 1:46:08 (done) 1:50:00

[@PIYUSH-lz1zq]

Is it different from the movie app you created earlier 🤔 that was also using toolkit

[@DipeshMalvia]

It's the same but combined video.

[@piyushaggarwal5207]

thanks for the video

[@faizannasimhyder9011]

Well done boi!

[@rrkrockstarraja3425]

excellent teaching my sweet heart

[@DipeshMalvia]

Many many thanks

[@thiyagum8649]

did you deploy this project? is it working after deployment?

[@shivaramr7042]

Very nice video, good tutorial, its really hard to find such good tutorials on youtube these days, some of them only half way you realise either the package has been cancelled or the person made some mistake while editing, thanks a lot for this tutorial, bro do you have a tutorial for a dashboard that has charts, forms, calendar, kanban? Am really in search of one, please do if you haven't done any, thank you

[@DaphneBonilla-y7w]

Thank you so much for this tutorial I was able to complete the app but noticed that I am only able to search for shows/series on the homepage I am not able to search from the show detail page. I've tried to debug for a while with no luck is this due to react 16 version updates?

[@gobindasaha7652]

Hello sir! I love your videos. I learnt a proper project structure from your tutorial. But if you could show the user login with a proper auth, token validation it would be a complete helpful tutorial me like learners. Thank you! 🙂

[@zMohammadz-MZ]

very gooooooood

[@DipeshMalvia]

Thanks and welcome to the channel!

[@sujanbista5117]

u the best

[@DipeshMalvia]

Thanks!

[@piyushaggarwal5207]

awesome video awesommmmeememme

[@pratixYT]

1. import {Routes} intead of {Switch} and use it instead of Switch 2.. In V6, you can't use the component prop anymore. It was replaced in favor of element:

[@DipeshMalvia]

Hey, here is the updated video of this tutorial with React v6 and context API - kzbin.info/www/bejne/kIuynHaohpecgs0

[@nageshworshah8314]

RtK querrry vs thunk which is good to use as a middleware in react

[@safariEnglishAcademy]

Very helpful

[@nidhi5767]

if i am uploading the api key it does not showing me the movie info please help

[@cagrizorkol]

thank you for video.. let me ask question.. which one is the best? Zustand or Redux Toolkit? What do you think?

[@DipeshMalvia]

Haven't used Zustand yet so can't say much which is better.

[@ericmomoh7927]

Redux toolkit is king as it has a wide community and documentation. But zustand saves you time with less code

[@saeedhalabi]

Just a quick update... the Switch component was removed in react-router-dom v6 and replaced with the Routes and Route components. To fix this, you'll need to update your code to be compatible with react-router-dom v6. - Replace Switch with Routes. - Update the Route components to use the element prop instead of component.

[@parinrajpara8312]

plz make a video on redux saga it's very useful to new devloper

[@ja_user]

I'm unable to fetch the api key. it says no patron was found. how to resolve?

[@siddharthpunmiya0705]

at 1:07:55 we dont have to spread the state right? becuase immer.js handles the state mutation

[@souravchatterjee5931]

The OMDB API key has not been received with my mail id.

[@pasumarthylakshmi958]

I am getting imdbId as undefined so i am unable to fetch the data in movieDetails.js.I am getting error as "Error":"Conversion from string "undefined" to type 'Double' is not valid.Please solve this issue

[@user121304]

I am getting this error while using useParrams(). {"Response":"False","Error":"Conversion from string "undefined" to type 'Double' is not valid."} Did anything change? I also saw some other people getting this error in your other video part -2 showing the same thing. This video is the combination of your part 1 and part 2. Why aren't you replying? Please reply, I want to complete this project.Thanks!

[@sahibjadatalibansari7365]

I want to react on this video and thunk you for this video

[@dhanarajccs]

could you please teach a tutorial on React E-commerce project ?

[@benyamin4634]

cool

[@akashsonar7161]

Sir i uploaded this project on netlify and heroku too but it's not showing any results it says movie/fetchAsyncMovie/rejected in redux extension help me to solve this

[@reactjs5350]

Waiting for Node.js and mongo db full course....!!! It is possible???

[@DipeshMalvia]

Yes, that's planned for next year.

[@abhinavkashyap2196]

44:00 personal bookmark.. Please ignore 😊

[@mmbmmbmmb]

i tried hiding my api key by using the REACT_APP_API_KEY in the .env file and tried the process.env but it isnt working

[@Sandeepkumar-ny7bd]

thanks for detailed video. You should use latest router v6 in this project.

[@DipeshMalvia]

Will do soon

[@gopireddy9508]

hii bro iam facing below error while ejecting This git repository has untracked files or uncommitted changes: package-lock.json M package.json M yarn.lock Remove untracked files, stash or commit any changes, and try again.

[@08-pruthiraj39]

Poster is undefined....what to do?

[@nasarshaik5207]

Hi sir, facing issue when i try to install sass package, any body facing same issue? npm ERR! path D:\React\Projects\RTK_MovieRatingApp\movieratingapp ode_modules ode-sass npm ERR! command failed npm ERR! command C:\Windows\system32\cmd.exe /d /s /c node scripts/build.js .. .. ..

[@regilearn2138]

use typescript for projects

[@aigulidrisova1126]

👏

[@doobtom271]

when u say "this is a too ass long React video for begging-ers", it is so funny hahaha XD. Great video, very useful, thank you.

[@ravoluzen]

getting a 'cannot read properties of undefined(reading selectMovieOrShow)' error when navigating to the movie detail page, trying to debug for quite a while, anyone else faced this?

[@daljeetsingh5127]

great j0b bro (y)

[@DipeshMalvia]

Thankyou!

[@GaneshSingh1]

Could you please upload video redux toolkit with redux saga

[@YourTechWhiz]

Why did you choose to use Scss? I think you can do the same work with CSS as well.

[@softultraviolence5673]

Yes, but SASS is required by many jobs, the purpose is to give an introduction to the technology, this tutorial is an introduction for SASS and Redux.

[@aniketbhalla1521]

You can't do nesting with CSS and that's the major benefit comes with SCSS.

[@kamalrenu1588]

How to dispatch synchronously in redux toolkit

[@adityagupta1213]

1:14:00 idk why my show cards have overlapped with movie cards.

[@karachiintermediatemaths7006]

i got error connect time out when fething api

[@muhammadmoeez5552]

list of error occur when installing node sass

[@taruntomar7947]

I need your help, I have a message while calling api that api call is undefined??? plz give me some suggestion

[@olasunkanmibalogun3234]

Hi, did you solve your bug? I'm also having the same issue, I get network error trying to call the API even though everything is fine.

[@abcd-qq9zb]

17:19

[@sanketkondhalkar6553]

HOW SHOULD I GET API KEY, YOU ARE NOT MENTOINED API KEY IN GITHUB, PLEASE BE MENTIONED THERE.

[@mohamedyoussef8835]

Awesome video ++++++++++++++++++++++++++ 😃

[@thiyagum8649]

did you deploy this project? is it working after deployment?