React Introduction to Redux

In this tutorial, you will learn to use Redux. You will install and configure Redux and use it within your React application. At the end of this tutorial, you will be able to:

  • Install and configure Redux within your application
  • Configure your React application to make use of Redux

Installing and Configuring Redux

  • As a first step you will install Redux and React-Redux into your application as follows:
  • $ npm install react-router-dom --save
    $ npm install redux react-redux --save
  • Next, create a folder named redux in the src folder and then add a file named reducer.js with the code below:
  • Then, add a file named configureStore.js in the redux folder and add the following code to it:
  • Next, open App.js and update it as follows:
  • Finally, update MainComponent.js to connect it to Redux store and use it:

(source: Front-End Web Development with React on Coursera)