ReactJS Course [14] - Redux Toolkit Tutorial

Рет қаралды 43,574

Күн бұрын

React Beginner to Advanced Course 2022! In this course I will be going over everything you need to know to go from a complete beginner in react, to being able to create big projects on your own.
Course Code/Exercises: github.com/machadop1407/React...
Course Discord: / discord
🚀 Learn ReactJS By Building 6 Projects: codedamn.com/learn/reactjs-pr...
🐙 GraphQL Course: codedamn.com/learn/graphql-fo...
► Buy Crypto on Coinbase: coinbase-consumer.sjv.io/PedroTech
Social
▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬
Linkedin: / machadop1407
Instagram: / _pedro.machado_
Github: github.com/machadop1407
Business Email: pedro@pedrotech.co
* Ep 14 - Markers
00:00 | Intro
01:02 | Project Introduction
02:02 | Package Installation
02:39 | What is a Store?
04:07 | Store Configuration
05:30 | Provider in Redux
07:01 | Creating Reducers for the Store
07:27 | What is a Slice?
08:52 | Creating the Slice
15:29 | Configuring the Login Page
24:22 | Typescript In Redux
Tags:
- ReactJS Tutorial
- ReactJS Course
- React Course
#reactjs #course

Пікірлер: 86

@minhthien8651 Жыл бұрын

Thanks to you, now I become React native developer. I'm going to work tomorrow.

@elmaralijev7499 Жыл бұрын

Thanks, one of the best Redux Toolkit explanations you can find👍

@faizanahmed9304 Жыл бұрын

This course is going crazy

@PedroTechnologies Жыл бұрын

Thank you!! I hope u mean cray in a good way hahaha

@excelemma5960 Жыл бұрын

Guess I'm not the only one

@hamzapaskingakhtar 11 ай бұрын

@@PedroTechnologies This redux is not good. Down to my 2 brain cells trying to wrap my head around it.

@davidzim2824 Жыл бұрын

Tank you Man you make it really clear

@Sylar7773 Жыл бұрын

Thank You, very good job 💪

@yajirushik2871 Жыл бұрын

So I have obtained recruitment project, deadline 31 march, use React, Redux Toolkit(I have newer used it but I know context API so here I go) and testing library. React Front position, wish me luck!

@PedroTechnologies Жыл бұрын

Good luck! You got this

@k303k Жыл бұрын

Thank you so much Pedro!

@nro337 Жыл бұрын

Awesome!

@user-ke9jo8dk2s Жыл бұрын

Great JOB!

@meraatmostafavi7758 Жыл бұрын

thanks that was great, just what I wanted ❤❤❤

@sumairimtiaz4545 Жыл бұрын

Superb. Thank you very much sir.

@kalixaegus4042 Жыл бұрын

Bro keep continuing this kind of tutorial like basic to advance. All my knowledge in web dev comes from your video and I love it so much. Next tutorial make a node js and express tutorial basic to advance like this vid. Good job bro my classmates keep watching your vid

@mateuszpaszczyk5845 Жыл бұрын

Great job!💪 Can You show us how to work with ESlint/Prettier in this series?🙏

@raymondtechmedia4469 Жыл бұрын

Great course

@sonamohialdin3376 Жыл бұрын

Very useful tutorial thank you

@muralikrishna9072 Жыл бұрын

Wow, This course going awesome ❤

@PedroTechnologies Жыл бұрын

❤️

@andresaliba Жыл бұрын

Good video! Small tip: You can click anywhere in any line then press Alt + Shift + ArrowDown to copy that line down, no need to copy paste :)

@rnjack5427 Жыл бұрын

In my keyboard I needed use 4 buttons.. alt, shift, s AS arrow down button, function key for activate arrow key.. but I am now used to it.

@kartikkaushik8613 9 ай бұрын

I use Custom key For Ctrl+D Its a lot convenient rather than that annoying Default set key.

@mohamedibrahim3294 Жыл бұрын

you are amazing thank you for this awesome video

@paologonzales4361 Жыл бұрын

great video

@AfonsoFilipeJr Жыл бұрын

Muito bem explicado!

@neelchalke6836 10 ай бұрын

Thank You.

@alexyap9138 Жыл бұрын

Thanks Pedro! I liked how you explained everything so clearly. I haven't worked with React in a long time so this was a big help. You've earned yourself a new subscriber :) Anyway, back to studying! So many new things to learn!

@slaffsla Жыл бұрын

It is a completely new concept to me, so I needed to rewatch it to kinda get it. This topic was hard, frankly, and I don't feel I can just use my knowledge. Will try watching your dedicated redux video. Otherwise a very fun and enriching course. Thank you from the bottom of my heart!

@samplechannel2312 Жыл бұрын

same feeling

@venkateshnani0207 Жыл бұрын

Same😂

@eshw23 Жыл бұрын

Its redux, its very hard for experienced devs to, dont worry about it, it will come with a lot of practice.

@hamzapaskingakhtar 11 ай бұрын

@@eshw23 Same bro. I have watched it 2 or 3 times now. Building a sketch on how it builds up step by step. That helps. Then would recreate it while explaining it to myself. Then build a similar project for myself using the concept

@goodgirl9484 8 ай бұрын

same

@kethakaranasinghe941 Жыл бұрын

Nice video bro🙂

@kirthivaasan6309 Жыл бұрын

Hi Pedro, your tutorials is very helpful. In Login component while getting name from redux store we have not defined the type for state for timebeing it was given any. Should we just we just give a string ?

@otasch Жыл бұрын

Hi Pedro, great work! I have one question. Is there a particular reason why you used type assertion (as UserState) instead of type annotation ( : UserState) on timestamp 27:20 ? Thanks!🦾

@frontendwithsalimi Жыл бұрын

hi pedro thank you for your course what course in your channel should i take after i finish this playlist course to be more advanced in react

@user-cu8nl5hy1k Жыл бұрын

This is absolutely the best video about RTK on KZfaq. I like the way he tackles the problem where in Redux you have multiple concepts that depend on each other and you sort of need to learn them all at once. Most YT tutorials fail to be good because of this issue. Here however Pedro nicely goes just as far as needed with one concept then jumps to another, and when you follow it sort of always makes sense what he is doing. +100

@gopeshgoswami752 Жыл бұрын

The entire course is really amazing, but am I the only one who is having issues understanding Redux :)

@eziosan7208 9 ай бұрын

Same bro 😢

@aditya205 Жыл бұрын

Hey Pedro! I wanna ask something that is redux being used further in the final project of this playlist? Cause I'm having a bit problem in understanding it...if it's necessary so i will focus on redux for a while.

@pizzaitaliana9835 Жыл бұрын

It is worth mentioning that when you write your reducers logic and update state you do it by directly mutating it. As we know that practice is strictly forbidden in React, but Redux uses a library called Immer under the hood to make it possible.

@17Jo5uE 5 ай бұрын

Could you give an exmaple of the correct way to mutate the state? I'm new in react jeje

@doktatyph Жыл бұрын

Please after this, teach us how to work with AsyncThunk with redux toolkit, I found so many tutorial out there but it's so hard to understand the concept, trust me I'd massively appreciate for that 🙏

@PedroTechnologies Жыл бұрын

Im making an individual video for that!! The course will end with a project and a video on testing!

@stepforward5881 4 ай бұрын

Hello , PedroTech. Ty for you great work. Could you help me with one problem? I can't figure out why did you use word "as" to assign interface for initialValue of slicer. What's the point and what is the rule? I can't find related info in documentation.

@Dev-Phantom 12 күн бұрын

cool

@priyangpatel8135 Жыл бұрын

13:00 would'nt in reducer return { ...state, changeProperty } would be better for immutablity.

@alisajadahmadi978 8 ай бұрын

This is really new to me and I am in a foggy condition. I don't have ant idea about it. I am a little bit disappointed of myself

@opeopemoni Жыл бұрын

Hello Pedro, thank you for giving the best courses ever ! Everything is clear and well explained ! I have a question, I have an error when I am trying to add a type "PayloadAction" for the action in the store It seems like "PayloadAction" can't be found. Do you, by any chance, know how to solve this ? Thanks !

@user-uw1rh4dg1y Жыл бұрын

Questions can come in⬆️

@maxwellhenderson9107 Жыл бұрын

Also had the sae issue.

@nanonkay5669 Жыл бұрын

If you had covered data normalization, that would've been super

@appz5351 Жыл бұрын

Hi Pedro - One small tip for you. I would be really nice to have "starter files" so that I can follow what you are doing from the same point as you are in the start of the video. Instead of having to go though all the files and (sometimes guess) what has to be deleted. TLDR: Starter files would be awesome so it's easier to follow your video - Thanks.

@TylerDeaton-xz9cz Жыл бұрын

Was thinking the same thing. Other courses I've done provide that. I was sometimes tempted to grab the files to make it easier to do the assignments, but I didn't want to accidentally see the solution.

@hamzapaskingakhtar 11 ай бұрын

It ain't that much. Don't be lazy man

@fortnitesmash7166 Жыл бұрын

Hey Pedro do we have to know redux ? To understand redux/toookit

@saidberk6599 10 ай бұрын

anyone facing Cannot read properties of undefined (reading 'value') issue?

@feeltrig8822 Жыл бұрын

Please do redux toolkit query in next one

@PedroTechnologies Жыл бұрын

Im doing an individual video on that!

@udaykulkarni5639 Жыл бұрын

First❤

@user-ke9jo8dk2s Жыл бұрын

Pedro, one more comment: for me it seems to be more difficult to use redux toolkid, create context much more understandable and easy to use. How do u think am i wrong about it?

@PedroTechnologies Жыл бұрын

This is a common thought! Redux is ugly and we all agree that context api looks better. Thing is, whenever a state changes in a context provider, all the components using the context rerenders. So for large apps, just the context api isnt enough. But for beginners it is!

@user-ke9jo8dk2s Жыл бұрын

@@PedroTechnologies thanx, Pedro! Good Luck to you, and all your family!

@rakaa31 Жыл бұрын

caan u make graphQL with React in this series!

@ritwik121 Жыл бұрын

@PedroTechnologies Жыл бұрын

I have a graphql course already which includes integration with React!! I would recommend watching that one right after this series 😁

@verydifferentthought Жыл бұрын

That's where things get very complicated...

@ritankarbhattacharjee7661 Жыл бұрын

How to sustain the data in the state if somebody refreshes the page?

@mayor3367 Жыл бұрын

Use localStorage for persistence. In the login reducer function, you can do something like this, localStorage.setItem('user', JSON.stringify(state.value.user)) In order to ensure that it can be received before the browser loads, you can do something like this in the initialState, const receivedUser = localStorage.getItem('user'); { value: { user: receivedUser ? receivedUser : "" } } In order to ensure that you can still logout, you can add the following to the logout reducer, localStorage.removeItem('user') //This removes the user item from the localStorage module.