FMP
Oct 21, 2024 8:03 PM - Sanzhi Kobzhan
Image credit: crypto prices tracker
Are you interested in tracking cryptocurrency prices and building your own simple app, but have no coding experience? Don't worry! This guide will walk you through how traders and analysts can use Financial Modeling Prep's Full Crypto Quote API to build a simple app that tracks prices using JavaScript. We'll keep things straightforward and easy to understand.
An API (Application Programming Interface) is like a messenger that takes requests and tells a system what you want to do, then returns the response back to you. In simpler terms, it's a way for different software applications to communicate with each other.
For example, when you use an app on your phone to check the weather, the app uses an API to request the current weather data from a server, which then sends the information back to your app.
Financial Modeling Prep (FMP) is a service that provides financial data through APIs. FMP's Full Crypto Quote API allows you to get real-time prices and other data for various cryptocurrencies like Bitcoin, Ethereum, and many others.
Step 1: Getting Your API Key
Before we begin, you'll need to obtain an API key from Financial Modeling Prep, you can get it after registering and choosing your plan on Financial Modeling Prep's Website.
Step 2: Setting Up a Basic HTML Page
First, we'll create a simple web page where we can display the cryptocurrency prices.
Create an HTML File
Basic HTML Structure with some design
Copy and paste the following code into your index.html file and remove the brackets () at the beginning and at the end of the code:
(
Cryptocurrency Price Tracker
// You can add more options here
)
This code sets up a simple web page with a heading, dropdown menu for selecting crypto and a div where we'll display the prices.
Step 3: Writing the JavaScript Code
Now, let's write the JavaScript code that will fetch the cryptocurrency prices and display them on our page.
Create a JavaScript File
Fetching Data from the API
In app.js., add the following code and also replace 'YOUR_API_KEY' with your actual API key at the beginning and at the end of the code:
(
const apiKey = 'YOUR_API_KEY';
function fetchCryptoPrice(cryptoSymbol) {
const apiURL = `https://financialmodelingprep.com/api/v3/quote/${cryptoSymbol}?apikey=${apiKey}`;
fetch(apiURL)
.then(response => response.json())
.then(data => {
displayPrice(data);
})
.catch(error => {
console.error('Error fetching data:', error);
});
}
function displayPrice(data) {
const priceDiv = document.getElementById('crypto-price');
priceDiv.innerHTML = '';
if (data && data.length > 0) {
const crypto = data[0];
priceDiv.innerHTML = `
${crypto.name} (${crypto.symbol})
Price: $${crypto.price.toFixed(2)}
Change Percentage: ${crypto.changesPercentage.toFixed(2)}%
Day High: $${crypto.dayHigh.toFixed(2)}
Day Low: $${crypto.dayLow.toFixed(2)}
`;
} else {
priceDiv.innerHTML = ' Data not available.
}
}
function handleCryptoSelection() {
const selectElement = document.getElementById('crypto-select');
const selectedCrypto = selectElement.value;
if (window.refreshInterval) {
clearInterval(window.refreshInterval);
}
fetchCryptoPrice(selectedCrypto);
window.refreshInterval = setInterval(() => {
fetchCryptoPrice(selectedCrypto);
}, 60000);
}
document.getElementById('crypto-select').addEventListener('change', handleCryptoSelection);
handleCryptoSelection();
)
Explanation:
Step 4: Testing your app.
Drag and drop your index.html file to the open browser window. In the opened app, select a cryptocurrency from the dropdown menu. You should see the heading with the cryptocurrency's name and symbol, followed by its current price and other details. The app will automatically update the price every minute. If you don't see the prices, press F12 to open the developer console and check for any errors in the console tab. You can also customize your app by changing its design. The code responsible for the design was placed in the index.html file.
Congratulations! You've just built a flexible cryptocurrency price tracker using Financial Modeling Prep's Crypto Quote API and JavaScript. Even without prior coding experience, you now have a basic understanding of how APIs work and how to use JavaScript to fetch and display data for any cryptocurrency you choose.
Oct 15, 2024 7:33 AM - Sanzhi Kobzhan
As you may know, there are three main equity valuation models. The Discounted Cash Flow (DCF) model discounts a company's free cash flow by the WACC (weighted average cost of capital), calculates the company's Terminal Value, discounts it by the WACC, sums up the result to get the Enterprise Valu...