|
12 | 12 |
|
13 | 13 | - NODE 2023 [Video](https://youtu.be/ChVE-JbtYbM)
|
14 | 14 |
|
| 15 | +3. [ Redux MasterClass Course Material - HERE](#redux-js-masterclass) |
| 16 | + |
| 17 | + - REDUX 2023 [Video](TODO) |
15 | 18 |
|
16 | 19 | # React JS MasterClass
|
17 | 20 |
|
@@ -2173,3 +2176,97 @@ It is easy to make travel booking for direct journey from one city to another. B
|
2173 | 2176 | - Care must be taken in timings of arrival and departure - so that one can continue the journey.
|
2174 | 2177 |
|
2175 | 2178 |
|
| 2179 | + |
| 2180 | +# Redux JS MasterClass |
| 2181 | + |
| 2182 | + |
| 2183 | +Hi, This is course page of **CoderDost Youtube Channel** Redux JS 2023 Course [Video Link ](TODO), |
| 2184 | + |
| 2185 | + |
| 2186 | + |
| 2187 | +### How to use this code : |
| 2188 | + |
| 2189 | + |
| 2190 | + |
| 2191 | +#### You can **download code** in 2 ways : |
| 2192 | + |
| 2193 | + |
| 2194 | + |
| 2195 | +1. **Git Commands** |
| 2196 | + |
| 2197 | + |
| 2198 | + |
| 2199 | +- use `git clone <repository_url>` |
| 2200 | + |
| 2201 | + |
| 2202 | + |
| 2203 | +- checkout 'redux' branch - All Chapters are in same branch but different folders `git checkout redux` |
| 2204 | + |
| 2205 | + |
| 2206 | + |
| 2207 | +- run `npm install` inside the each folder before running the code |
| 2208 | + |
| 2209 | + |
| 2210 | + |
| 2211 | + |
| 2212 | + |
| 2213 | +2. If you are not comfortable with git, directly **download the branch as Zip**. |
| 2214 | + |
| 2215 | + |
| 2216 | + |
| 2217 | +- Choose branch related to the Redux e.g. `react`. It contains all chapter |
| 2218 | + |
| 2219 | + |
| 2220 | + |
| 2221 | +- run `npm install` inside each chapter folder before running the code |
| 2222 | + |
| 2223 | + |
| 2224 | + |
| 2225 | + |
| 2226 | + |
| 2227 | +# Redux JS Series |
| 2228 | + |
| 2229 | + |
| 2230 | + |
| 2231 | + |
| 2232 | +## Chapter 1 - Redux Concepts and Pattern |
| 2233 | + |
| 2234 | + |
| 2235 | + |
| 2236 | +- **Assignment 1** : Using the concepts learnt in this chapter. Make a Async type of call from a new reducer to any online API like [JSON Placeholder Posts](https://jsonplaceholder.typicode.com/posts). Also show proper loading messages in console. Like - `loading posts...`, `posts loaded` , `posts fetching failed`. Also add those posts to a state of reducer in a sorted manner (sort by `title`) |
| 2237 | + |
| 2238 | +- **Assignment 2** : Check out IMMER library and run some example and see how you can make mutating updates like `state.amount++` inside reducer logic. And still it work perfectly in redux. |
| 2239 | +[Immer Link](https://immerjs.github.io/immer/) |
| 2240 | + |
| 2241 | + |
| 2242 | + |
| 2243 | +## Chapter 2 - Redux With React Application |
| 2244 | + |
| 2245 | +- **Assignment 1** : Add more cases in Account Reducer called `decrementByAmount` . Also check that amount should not be decremented in case `amount` to be decremented is less than account Balance. For e.g. if total amount in account is 10, you can't decrement by 11. Also show an error in that situation to user. |
| 2246 | + |
| 2247 | + - **Assignment 2** : Check out IMMER library and run some example and see how you can make mutating updates like `state.amount++` inside reducer logic. And still it work perfectly in redux. |
| 2248 | +[Immer Link](https://immerjs.github.io/immer/) |
| 2249 | + |
| 2250 | +## Chapter 3 - Redux Toolkit with React |
| 2251 | + |
| 2252 | +- **Assignment 1** : Add more cases in Account Reducer called `decrementByAmount` . Also check that amount should not be decremented in case `amount` to be decremented is less than account Balance. For e.g. if total amount in account is 10, you can't decrement by 11. Also show an error in that situation to user. |
| 2253 | + |
| 2254 | + - **Assignment 2** : Create more async thunk examples, we only tried GET USER- `READ` example. But try the `CRUD` example to `Create` new user, `Update` the user, `Delete` the user. |
| 2255 | + - You have to create a list of `users` which has names of all users in local database |
| 2256 | + - You an `INPUT BOX` to add new users to `list` , users show also add to database and updated in list.[Hint: use REST API concepts for Create API, POST method] |
| 2257 | + - You can put a `delete` button on end of list item. On clicking of this button `user` list item will be deleted from database. [Hint: use REST API concepts Delete API, DELETE method] |
| 2258 | + - You can put a `selected` button on end of list item. On clicking of this button `user` list item will change colors. [Hint: use REST API concepts Update API, PUT/PATCH method] |
| 2259 | + |
| 2260 | + |
| 2261 | +## Chapter 4 - Redux Toolkit Query |
| 2262 | + |
| 2263 | + |
| 2264 | + |
| 2265 | +## Chapter 5 - Redux Toolkit with Async Thunk - Product and Card Project |
| 2266 | + |
| 2267 | + - **Assignment 1** : Add a `<Select>` on Product Card also which shows quantity selector, So user can add item with a particular quantity also initially. |
| 2268 | + - **Assignment 2** : Change the `<Select>` on Cart Items to `+` and `-` buttons which should increment or decrement quantity of item in the cart. Also check if Cart total is coming correct. |
| 2269 | + |
| 2270 | +## Chapter 6 - Redux Saga Introduction [Optional chapter] |
| 2271 | + |
| 2272 | +- **Assignment 1** : Complete the `delete` and `update` feature using Redux Saga middleware |
0 commit comments