Fetching The Data With Redux and Redux Thunk

We’re finally ready to fetch our data. We’re going to use the coinmarketcap public API. If you find a better crypto API — please let me know!

Make a src/Utils/Constants.js file and add our API base URL there.

Why? If the API URL ever changes — we only need to change it in one place, neato! 👍

Next— head over to src/Actions and make a file called FetchCoinData.js — here we will be fetching our cryptocurrency coin data. We’re going to use axios (yes I’m aware of the native fetch API) — I still very much prefer axios.

Quick google search shows why (more options, better API, better error handling).

npm i --save axios

Import axios and the apiBaseURL from Constants.js — also, add the boilerplate for the action. Try to implement this on your own. Remember, an action is just a function which gets exported.

Ready?

Creating Actions

action boilerplate

Next, we return a thunk action. Thunk actions are functions. Why Thunk? More control. I will show you exactly what I mean.