Build a Cryptocurrency Returns Calculator with ReactJS + CoinGecko API (Part 2)

Step-by-step beginner React tutorial to turn the Bitcoin returns calculator into any cryptocurrency calculator.

const [coin, setCoin] = useState();
<input defaultValue={coin} onChange={(val) => setCoin(val)} />
const coingeckoUrl = (coin, date) => {
return `https://api.coingecko.com/api/v3/coins/${coin}/history?date=${date}&localization=false`;
};
const coingeckoFetch = async (buy, coin, date) => {
fetch(coingeckoUrl(coin, date)).then((response) =>
response.json().then((jsonData) => {
coingeckoFetch(true, coin, val);
const handleCoinChange = (e) => {
let val = e.target.value;
setCoin(val);
coingeckoFetch(null, coin, val);
};
const coinList = [
{ id: 0, name: “None Selected” },
{ id: 1, name: “bitcoin” },
{ id: 2, name: “ethereum” },
{ id: 3, name: “tezos” },
{ id: 4, name: “cardano” },
];
<select defaultValue={coin} onChange={(val) => handleCoinChange(val)} >{coinList.map((item) => (
<option key={item.id}>{item.name}</option>
))}
</select>
Screenshot of the complete function returns calculator

--

--

Blockchain Maximalist

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store