Oh finally comments are available. This is video is really pure gold to get a good introduction to modern redux. It really helped me last year when i started a new job. Thank you Jason and Mark
I love it! Thanks, Guys for this video! I had an experience with redux before, then switched to GraphQl Apollo. There are a few similarities between both. But it is good progress for Redux.
I wonder about naming convention of the reducers and actions: in the video the reducers are named to the past "incremented" & "decremented" in the slice, so forth the actions are named the same. However it would sound more natural to me that the actions to be named "increment" & "decrement". So would you name your slice reducers to the past or present?
at 50:52 can anyone explain the dispatch usage here? Currently I get prompt that dispatch does not take arguments, line 12 of the click handler function in app tsx in vod
I'm trying to understand the "optional add on" comment for RTK Query. I looked on the toolkit page and I could not figure out how much the optional add on costs. Is it all open source, or is there a financial model someplace in here to pay for the dev work?
By 'you don't pay for it' - he meant pay for it as in you won't increase the bundle size from the import unless you choose to use RTK Query, not with real money haha.
@@markerikson3383 I did the same, lol. The reason I was searching for a paid version is not only the comment but also that when I use createApi from the "optional add-on" I get typescript error because it returns me an object of type any. When I import it from ""@reduxjs/toolkit/query" I get the Api type of object but the hooks are missing. TS version is 5.1.6 What should I do to get this working ?
some of these increments are great but my God the createApi seems like a ridiculous pain, especially in an app where say I have to make ~30-50 different API calls
the only annoying thing about this video is the guys talking about things like data request cache like if it was such a new thing... maybe to Redux but not to other state managers libs haha "wait why it didnt fetch again?" Come on man hahaha
Because when we made this video, RTK Query was not fully finished. It was only available in preview releases of Redux Toolkit, published to NPM under an `@next` tag. We later published RTK 1.6.0, which was the first release that officially included RTK Query, and all versions of RTK since then have the RTK Query pieces included.
What is Redux & context [2:22]
[14:30]
Recommend hooks API as default [15:24]
`connect` difficult for TypeScript [16:31]
Redux Toolkit [18:16]
Where to go? [18:36]
pre-defined templates on create-react-app
Vite [19:30]
project start files [21:26]
dependencies [23:33]
features folder [25:00]
features/counter/counter-slice.ts [25:48]
`createSlice` [27:25]
`Immer` package within for state updates [32:05]
redux store [35:20]
app/store.ts
configureStore with defaults: [36:10]
- Redux-Dev-Tools Extension
- Thunk middleware
types export [38:06]
main.tsx [40:15]
app/hooks.ts [42:40]
`useAppDispatch`
`useAppSelector`
App.tsx [46:30]
counterSlice.reducers.amountAdded(state, action: PayloadAction) [53:00]
---
Docs: Writing Thunks [56:26]
`createAsyncThunk`
createSlice -> extraReducers [59:19]
---
Docs: RTK Query Overview [1:02:09]
Demo: Dogs as a Service data fetching [1:03:04]
features/dogs/dogs-api-slice.ts
`createAPI` [1:06:55]
store.ts [1:14:20]
reducer & middleware
features/dogs/dogs-api-slice.ts [1:17:32]
export generated hook
App.tsx [1:19:07]
Thank you for taking your time doing this.
Thank you@@Kenai_BR
Thank you
Oh finally comments are available. This is video is really pure gold to get a good introduction to modern redux. It really helped me last year when i started a new job. Thank you Jason and Mark
This is extremely helpful for a newbie. It's great to see everything from the start with simple explanation to it. Great stuff!
This video was a game-changer! Thank you, gents.
I really appreciate these methods! They're straightforward and easy to follow. Thanks
I always had hard times understanding modern redux, thanks to you and Mark, I finally understood the whole base concept. Keep up the good work 👍👍
hooks generation is DOPE. I'm in!
such a good quality of content, and that is 2 years ago. You deserve more attention!
This video is changing my life: redux toolkit is, nowadyes, the ultimate solution for handling you enitre application. Thanks so much guys!
One of the best tutorial on redux toolkit. Much appreciated!!
Finally I can understand pretty well redux toolkit
Still wondering why you have installed axios! Thought you gonna do something with it instead of RTK Query!
I was on the fence about createApi, the documentation is really intimidating but this explains it very well, thank you! this is so useful!!
even on my weak computer the installation did not take much time, thank you very much
that's vite for ya lolol
A great episode, thank Erik and Jason!
Niiiiiice - thanks so much!!=) that was glorious - the short term caching at the end was gold=)
I love it! Thanks, Guys for this video! I had an experience with redux before, then switched to GraphQl Apollo. There are a few similarities between both. But it is good progress for Redux.
Amazing video, thank you!!
I wonder about naming convention of the reducers and actions: in the video the reducers are named to the past "incremented" & "decremented" in the slice, so forth the actions are named the same. However it would sound more natural to me that the actions to be named "increment" & "decrement". So would you name your slice reducers to the past or present?
Finally, I understood this! Thanks!
Thank you two. This is very helpful!!!
at 50:52 can anyone explain the dispatch usage here? Currently I get prompt that dispatch does not take arguments, line 12 of the click handler function in app tsx in vod
EDIT: hooks, I forgot the complete type casting of dispatch, added empty parenth at the end
this is GOLD!
I never imagined that a Jason teach me how to retrieve JSON lol
I'm trying to understand the "optional add on" comment for RTK Query. I looked on the toolkit page and I could not figure out how much the optional add on costs. Is it all open source, or is there a financial model someplace in here to pay for the dev work?
By 'you don't pay for it' - he meant pay for it as in you won't increase the bundle size from the import unless you choose to use RTK Query, not with real money haha.
Hah, I meant "pay" as in "your JS bundle gets larger when you import this" :)
All the Redux packages are 100% open-source _and_ free-to-use monetarily
@@markerikson3383
I did the same, lol.
The reason I was searching for a paid version is not only the comment but also that when I use createApi from the "optional add-on" I get typescript error because it returns me an object of type any. When I import it from ""@reduxjs/toolkit/query" I get the Api type of object but the hooks are missing. TS version is 5.1.6 What should I do to get this working ?
This is gold right here......eureka
Everything is a (Gangsta)state management library until the real Gangsta(Redux Toolkit) comes out.
Great and clear, thanks guys
Awesomely elegant.
The fact that this video is not on the top of the search results for redux is criminal
awesome tut
what a great content here. Terima Kasih
how can we get updated RootState if someone injecting reducer dynamically in run time for code splitting ?
nice demo
Hi!, What is the font you use in your vscode?
Operator Mono jason.af/uses
which font you are using in code editor?
Operator Mono! My setup is here: jason.af/uses
@@learnwithjason Ok, Operator Mono is the best thing I found this year. thanks for that!
AMAAAZINGG
some of these increments are great but my God the createApi seems like a ridiculous pain, especially in an app where say I have to make ~30-50 different API calls
so helpful
thank you
I thought it was a hoax, but everything works!
RTX is not working with `2.0.0.beta.0`
captions don't sync with video. please correct it
new captions syncing now :)
Extremely useful! Thank you both so much. But I can't stand all the popups from the live audience. I found it very distracting.
I will answer a question anywhere I find a text box 😆
Super !
holy shit. redux toolkit has immer built in?!!
Can we please make it a little bit harder for the beginners.PLEASE
great
why cant there just be a store as an object and just store.counter +=1 and when we want do store.counter tf is all this stupid complexity
the only annoying thing about this video is the guys talking about things like data request cache like if it was such a new thing... maybe to Redux but not to other state managers libs haha
"wait why it didnt fetch again?"
Come on man hahaha
hey! why are they using /next and not the normal npm i @reduxjs/toolkit/next?
Because when we made this video, RTK Query was not fully finished. It was only available in preview releases of Redux Toolkit, published to NPM under an `@next` tag.
We later published RTK 1.6.0, which was the first release that officially included RTK Query, and all versions of RTK since then have the RTK Query pieces included.