Learn to add the current value of Bitcoin on your website only with javascript

Screenshot 2021-01-23 105857.jpg

Today we are going to learn how to consume the API that it provides us https://www.coindesk.com in order to add the current value of Bitcoin to our website

To do this, we will first go to the coindesk website at the following link https://www.coindesk.com/coindesk-api


Our Html would look like this:


<head>
    <link rel="preconnect" href="https://fonts.gstatic.com">
    <link href="https://fonts.googleapis.com/css2?family=Oxygen:wght@300&display=swap" rel="stylesheet">
</head>
<body>
</body>


Our css would look like this:


*,
*::before,
*::after{
  box-sizing: border-box;
  margin: 0;
}
body {
  font-family: 'Oxygen', sans-serif;
  font-weight: 700;
  color : #c00;
}
div {
    padding: 10px;
    background-color: #ededed;
}
b {
    font-size:.7em;
    padding-left:1em;
}


And most importantly the .JS :

async function main() {
    const result = await fetch('https://api.coindesk.com/v1/bpi/currentprice.json')
    const data = await result.json()
    const div = document.createElement('div')
    const price = data.bpi.USD.rate.split('.')
    const act = document.createElement('b')
    act.innerText = `Updated on ${data.time.updated}`
    div.innerText = `Bitcoin : ${price[0]} $`
    div.append(act)
    document.body.append(div)
  }
main()


With this we have the tutorial ready, now you can have the current value of bitcoin on your website.


You can see the live example by entering my Pen https://codepen.io/jfdesousa7/pen/MWjLyXm


Don't forget to visit my official website TupaginaOnline


H2
H3
H4
3 columns
2 columns
1 column
1 Comment
Ecency