The Ultimate Redux Course - [LATEST Redux-toolkit]

Basics of functions in JavaScript are covered, illustrating first-class citizens by assigning functions to variables, passing them as arguments, and returning them from other functions.

Explore higher order functions in functional programming by using functions as parameters or return values, with examples like setTimeout and Array.map.

Explore function composition in JavaScript by building small reusable functions to trim names, generate greetings, and convert to uppercase, and learn why composing improves readability.

Learn how pure functions yield the same output for identical inputs and avoid impure Redux reducer patterns by passing data as parameters. Experience easier testing and clearer, self-explanatory code.

Demonstrates immutable array operations by adding, updating, and removing items using spread, map, and filter, including placing 50 at a specific index and replacing 40 with 80.

Utilize the produce function to update a nested object's price and rating, replace a book via map, log results, and prepare to learn Redux from scratch.

Learn how to run Redux from scratch, create a store, define actions and reducers, dispatch actions from the store, and manage subscriptions and the folder structure.

Discover how Redux manages app state in a single store, using reducers and actions to update state and enable easy debugging.

Design and implement a redux to-do app by outlining the store structure, listing actions, creating reducers, and building the redux store, while focusing on redux over the UI.

Design the store structure for a to-do app by storing tasks in an array of objects with id, details, and a default completed false, plan two slices: task and employees.

Learn how to list all Redux actions by defining add task, remove task, and task completed, and apply a consistent type and payload structure for reducers, including filtering capabilities.

Create a reducer function to manage tasks with an initial empty state, handling add task and remove task actions using type and payload. Learn switch-case alternatives and default state return.

Learn to create a Redux store by installing Redux, using createStore with a root reducer, and exploring dispatch and getState, while noting the deprecation.

Dispatch actions from the Redux store using dispatch and action creators that return objects with type and payload for adding and removing tasks, updating the reducer accordingly.

Create a central action types file to store constants like add task and remove task, then import them in reducer and action files to use action types.

Subscribe to the Redux store to run a callback on every state change, and use the returned unsubscribe function to stop receiving updates.

Practice a Redux exercise to reinforce concepts by marking a task as completed. Pass the task id and update the reducer to set the completed property to true.

Learn to add a new action type for completing a task, update the reducer to mark the matching task as completed, and dispatch the completed task action.

Organize Redux code with a store folder and feature subfolders for actions, reducers, and action types. Compare the module approach that consolidates code into one file for easier maintenance.

Organize actions, reducers, and action types in one file by restructuring into a store with task.js, consolidating action types, actions, and reducer, and updating imports.

Learn to debug Redux applications using Redux dev tools, configure the tools, view and trace actions, and import and export log files for Redux workflows.

Install the redux dev tools extension from the Chrome web store and configure it in your store to connect your app with redux dev tools for debugging.

Learn to build reader applications with Redux Toolkit, reducing boilerplate for the store, actions, and reducers. Explore create action, create reducer, and create slides as a modern configuration.

Discover how Redux Toolkit simplifies Redux code by handling boilerplate with configureStore, createAction, and createReducer, while guiding installation and best practices for using Redux Toolkit.

Configure store using Redux Toolkit streamlines setup by replacing createStore with configureStore, auto enabling DevTools and supporting async actions, reducing middleware boilerplate.

Learn how to define reducers with Redux Toolkit using createReducer, converting mutable code to immutable under the hood, and manage actions like add, remove, and complete tasks.

practice adding employee data to a redux toolkit store by creating an employee slice with id and name, exporting its reducer, and wiring it in configureStore.

Create a redux toolkit employee slice with createSlice, set initial state and implement add employee using action.payload for id and name, export actions and reducer, configure the store, and dispatch.

Explore combining reducers manually or via Redux Toolkit, configure a store with task and employees slices, import and rename reducers, and reflect state as an object containing task and employees.

Explore the concept of Redux middleware, learn how to create middleware, implement logging for all actions, and prepare for upcoming sections.

Understand Redux middleware as a function that runs after dispatch and before the reducer, enabling logging, and API calls. Learn to create your own.

Create a log middleware to log every dispatched action and wire it into configure store, replacing default middleware, while ensuring next(action) passes to the next middleware.

Explore the redux-logger middleware to log actions, previous state, and updated state for debugging Redux applications.

Create a new ETA middleware, detect error actions, cancel those errors, and pass non-error actions to the next middleware.

Build a redux error middleware that handles show error actions by logging and passing the payload to next, optionally displaying toasts, and wire it into the store in the order.

Learn how to call an API in a Redux app using simple functions, async trunk method, or custom API middleware, and choose one to apply consistently.

Set up the backend for API by configuring a local server, installing dependencies, and running node server on port 5000 to handle task endpoints for get, add, update, and delete.

Explore Redux-based api calls with a simple Axios function to fetch tasks, dispatch results to a task reducer in the store, and implement try-catch error handling.

Learn how to use createAsyncThunk from Redux Toolkit to call an API with axios, manage loading and error states, and handle pending, fulfilled, and rejected actions in a task slice.

Define a base URL for API requests by creating a utils/http.js file that exports an axios instance with a baseURL set to localhost:5000, then use this instance for all requests.

Create a Redux Toolkit api middleware that intercepts api request actions, uses axios to call a base url localhost:5000/api, and dispatches on success or error with the response data.

Create a new action and reducer to set loading true, wire it in the middleware as API requested, then set loading false on completion and show error action when needed.

Learn to add a new task via an API call, posting a payload, handling ID and completed properties, and store the response in the Redux store using reducers.

Implement a delete task API by duplicating the update method, removing the payload, dispatching a delete action with the task id, and confirming deletion via the API middleware.

Create a React application from the command prompt, naming it to do app and pressing enter. Open project in code, navigate with cd, and run npm start to test it.

Add Redux code to a React application by placing it in the stored folder, and optionally a utils folder, then install Redux Toolkit and axios for the setup.

Dispatch a load task action from the store, subscribe to store updates, and manage task state with useEffect and unsubscribe cleanup, then render tasks with map.

Connect a React app to Redux with react-redux by using the provider and passing the store as a prop, removing the old store context.

Learn to dispatch actions and read state with useDispatch and useSelector in functional components, manage task and employee slices, handle loading with useEffect, and connect Redux Toolkit to a provider.

Share your review to inspire better Redux and Redux toolkit lessons and help reach more students who want to learn Redux.