Merhaba, sitemizdeki bu yazıda sizlerle Kripto kurlarını JavaScript ile nasıl çekebileceğinizi paylaşacağım.
Kripto Para Nedir?
Kripto para birimleri, dijital para birimleridir. Bu para birimleri, merkezi bir otorite veya kuruluş tarafından değil, kriptografik yöntemler kullanılarak üretilir ve işletilir. Kripto para birimleri, blok zinciri teknolojisi kullanılarak güvenli bir şekilde saklanır ve transfer edilir.
En yaygın kripto para birimleri Bitcoin, Ethereum, Tether ve Litecoin’dir. Ancak, bu para birimlerinin yanı sıra, birçok farklı kripto para birimi de mevcuttur. Kripto para birimleri, genellikle fiat para birimlerine (dolar, euro vb.) karşı değerleri belirlenir ve bu değerler yüksek derecede volatilite (değişkenlik) gösterir.
Kripto para birimleri, çeşitli amaçlar için kullanılabilir. Örneğin, online alışverişlerde kullanılabilir, ödemelerde kullanılabilir veya yatırım amacıyla da saklanabilir. Ancak, kripto para birimleri hakkında yasal mevzuat ve denetimler çok az olduğu için, yatırım yaparken dikkatli olunması önerilir.
Kripto Para Kurları Nereden Alınabilir?
Bunun için öncelikle bir API kullanarak kripto kurlarının verilerine ulaşmanız gerekiyor. Örneğin, CoinMarketCap veya CryptoCompare gibi siteler tarafından sağlanan API’leri kullanarak kripto kurlarını çekebilirsiniz. Daha sonra, JavaScript kodunuz ile bu API’yi çağırarak verileri çekebilir ve istediğiniz şekilde kullanabilirsiniz. Örnek bir kod parçacığı aşağıdaki gibidir:
Burada CryptoCompare API’sini kullanarak JavaScript ile kripto kurlarını çekmeye yarayan bir örnek veriyorum:
1 2 3 4 5 6 7 | fetch('https://min-api.cryptocompare.com/data/price?fsym=BTC&tsyms=USD,EUR,TRY') .then(response => response.json()) .then(data => { console.log(data); // Bitcoin'in dolar, euro ve lira cinsinden değerleri }); |
Console Çıktısı:
1 2 3 | {USD: 17350.12, EUR: 16162.27, TRY: 330623.89} |
Bu örnekte, fsym parametresi ile hangi kripto para biriminin verilerini çekeceğimizi, tsyms parametresi ile de hangi para birimlerine çevireceğimizi belirtiyoruz. Bu örnekte, Bitcoin’in dolar ve euro cinsinden değerlerini çekiyoruz.
Daha sonra, fetch() fonksiyonu ile API’ye istek gönderiyor ve cevabı alıyoruz. Cevabın içinde bulunan verileri, response.json() ile JSON nesnesine dönüştürüyor ve then() bloğunda işleyebiliyoruz. Bu örnekte, dolar ve euro cinsinden değerleri console.log() ile ekrana yazdırıyoruz.
Ancak istekler her zaman sekron gelmeyecektir. Bunun için async ve await ifadelerini kullanmak gerekir. Örnekte, async ve await anahtar kelimelerini kullanarak CryptoCompare API’sinden veri çekme işlemini daha okunaklı hale getiriyoruz:
1 2 3 4 5 6 7 8 9 | async function getPrices() { const response = await fetch('https://min-api.cryptocompare.com/data/price?fsym=BTC&tsyms=USD,EUR,TRY'); const data = await response.json(); console.log(data); // Bitcoin'in dolar, euro, lira cinsinden değerleri } getPrices(); //ileride metoda bağlayarak getireceğiz. |
Yine çıktı yukarıdaki gibi olacaktır.
Bu örnekte, getPrices() adında bir asenkron fonksiyon oluşturuyoruz. Bu fonksiyon içinde, fetch() fonksiyonu ile API’ye istek gönderiyor ve cevabı alıyoruz. Cevabın içinde bulunan verileri de, response.json() ile JSON nesnesine dönüştürüyoruz. Daha sonra, dolar, euro ve lira cinsinden değerleri console.log() ile ekrana yazdırıyoruz.
async anahtar kelimesi ile işaret ettiğimiz fonksiyonlar, asenkron olarak çalışır. Bu sayede, await anahtar kelimesini kullanarak içinde bulunan asenkron işlemlerin tamamlanmasını bekleyebiliriz. Bu sayede, kodumuz daha okunaklı ve anlaşılır hale gelir.
Bu kod parçacığına bir zaman aralığı ekleyerek, belirli aralıklarla API’den veri çekme işlemini gerçekleştirebilirsiniz. Örneğin, aşağıdaki kod parçacığında, her 2 saniyede bir API’den veri çekme işlemini gerçekleştiriyoruz:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 | <!DOCTYPE html> <html lang="tr"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Tasarım Kodlama</title> </head> <body> <script> setInterval(async function () { const response = await fetch( 'https://min-api.cryptocompare.com/data/price?fsym=BTC&tsyms=USD,EUR'); const data = await response.json(); console.log(data); // Bitcoin'in dolar, euro, lira cinsinden değerleri }, 5000); </script> </body> </html> |
Gelen veriyi div elementi içinde JSON verilerini göstermek için aşağıdaki gibi bir kod yazabilirsiniz:
Aşağıdaki kod parçacığında setInterval() fonksiyonunu ve div elementini kullanarak, belirli aralıklarla API’den veri çekme işlemini gerçekleştiriyoruz:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 | <!DOCTYPE html> <html lang="tr"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Tasarım Kodlama</title> </head> <body> <script> setInterval(async function () { const response = await fetch( 'https://min-api.cryptocompare.com/data/price?fsym=BTC&tsyms=USD,EUR,TRY'); const data = await response.json(); document.getElementById('prices').innerHTML = ` 1 BTC = ${data.USD} USD<br> 1 BTC = ${data.EUR} EUR<br> 1 BTC = ${data.USD} TRY<br> `; }, 2000); </script> <div id="prices"></div> </body> </html> |
Çıktı:
Bu örnekte, setInterval() fonksiyonu kullanılarak her 5 saniyede bir API’den veri çekme işlemini gerçekleştiriyoruz. İçinde bulunan asenkron fonksiyon içinde, CryptoCompare API’sinden veri çekiyor ve response.json() ile JSON nesnesine dönüştürüyoruz. Daha sonra, document.getElementById() ile div elementinin ID’sini arıyor ve bu elementin innerHTML özelliğini güncelliyoruz. Bu örnekte, div elementi içine Bitcoin’in dolar ve euro cinsinden değerlerini yazdırıyoruz.
Umarım bu örnek size yardımcı olmuştur! Eğer daha fazla yardıma ihtiyacınız olursa, lütfen sorun.
Yorum Yap