
Download the Node.js and npm installer for your operating system and architecture, run the executable to install, then verify the installation in the terminal.
Learn how to use object and array destructuring to extract properties and values into variables, with practical examples from objects and arrays.
Implement asynchronous redux actions with redux-thunk to fetch todos from a placeholder API, dispatch results to the reducer, and update the to-do list while explaining middleware and axios usage.
Define a get task action and its reducer to fetch and store tasks from an API, set up a dedicated task module, and prepare for Redux thunk middleware integration.
Learn to manage a task list loading state in Redux with React hooks by dispatching get task begins, handling success or failure, and showing a centered loading spinner.
Implement a toast notification using react-toastify in a Redux beginner guide with React hooks, showing success and error messages, configuring the library, and auto closing after 1500 ms.
Learn to implement the add task action and reducer with redux and react hooks, using begin, success, and failure patterns, a post api call, and appending the task while loading.
Create an add task form UI that launches a modal from the add button, including a task name field and status radios (completed or pending) built with bootstrap.
Master Redux with the latest React Hooks.
What is Redux?
A Predictable State Container for JS Apps
♦ Redux helps you write applications that behave consistently, run in different environments (client, server, and native), and are easy to test.
♦ Centralizing your application's state and logic enables powerful capabilities like undo/redo, state persistence, and much more.
♦ The Redux DevTools make it easy to trace when, where, why, and how your application's state changed. Redux's architecture lets you log changes, use "time-travel debugging", and even send complete error reports to a server.
♦ Redux works with any UI layer and has a large ecosystem of add-ons to fit your needs.
What is React?
A JavaScript library for building user interfaces
♦ Declarative: React makes it painless to create interactive UIs. Design simple views for each state in your application, and React will efficiently update and render just the right components when your data changes.
♦ Component-Based: Build encapsulated components that manage their own state, then compose them to make complex UIs. Since component logic is written in JavaScript instead of templates, you can easily pass rich data through your app and keep the state out of the DOM.
♦ Learn Once, Write Anywhere.
What is React-Redux?
♦ React Redux is maintained by the Redux team, and kept up-to-date with the latest APIs from Redux and React.
♦ Designed to work with React's component model. You define how to extract the values your component needs from Redux, and your component receives them as props.
♦ Creates wrapper components that manage the store interaction logic for you, so you don't have to write it yourself.
♦ Automatically implements complex performance optimizations, so that your own component only re-renders when the data it needs has actually changed.
You will learn the following things in the course:
♦ Build the React app with hooks and redux state management library.
♦ Learn redux concepts such as Action, Reducer, State, Middleware, Dispatch, Async Action, Redux logger, and Redux-thunk.
♦ Learn to implement the best practices when handling application-level state with redux in react.
♦ Learn to make use of redux-thunk middleware to make your action creator asynchronous.
♦ Feel Confident with Redux Concepts and its integration with React Hooks.
♦ Learn the best practices to update the global state from reducers.
♦ Learn to debug the react app state with redux dev tools.
♦ Start with redux concepts basic and then implement redux with react hooks by building the real-world app.
♦ and much more.