In this tutorial, we’ll learn about many of Redux concepts by creating a simple React application from scratch using React, Redux and Axios to asynchronously fetch and save data to Local Storage.

The application we’ll be building is a simple JavaScript Jargon app that’s based on the Simplified JavaScript Jargon available from this repository. We’ll export the entries as JSON data and we’ll consume it from our React application using Axios. . The state will be handled by Redux.

For our demo application, We created a statically generated JSON API from the Simplified JavaScript Jargon GitHub repository.

Note: If you are consuming any other resource, make sure you have CORS enabled so the browser doesn’t disallow reading the remote resource due to the Same Origin Policy.

The app will also include a favorites page where you can add and delete your favorite JS terms from the jargon.

These are the steps of our tutorial:

  • Step 1 — Installing Create-React-App & Initializing a React Application
  • Step 2 — Installing Axios, Redux, React-redux and Redux-thunk
  • Step 3 — Creating Redux Actions
  • Step 4 — Creating Redux Reducers
  • Step 5 — Creating the Redux Store
  • Step 6 — Creating the React Component
  • Step 7 — Saving Data to Local Storage

#react #redux

React, Axios and Redux: Asynchronously Fetch and Save Data to Local Storage
5.90 GEEK