![]() We then change the value of the pound input to our calculation we just created. ![]() We create three const the first euroamount gets the exchange rate from the api, the euro const gets the value from the euro input and the last const pound does the calculation and rounds up the numbers to 2 decimal places. ![]() We then use the response we just fetched and get the data from it to do our calculation. To something which we can use for our script. So we then parse it using the json method. When using the fetch command the data which is returned is just a response. In this tutorial we’ll be building a simple currency converter with HTML and JavaScript. document.querySelector(".convertButton").addEventListener("click", mone圜onvert) ĮuroField.addEventListener("input", mone圜onvert) įinally we going to use the fetch command to get a an up to date exchange value. Basically, there are two sections for two currency, you can compare them by switching up and down also you can select any currency from the dropdown. The event listener fires an event if the input changes in the euro field or if the user presses the convert button. We now going to create two event listeners which will execute our function which we will create shortly. const endpoint = '' Ĭonst euroField = document.querySelector(".euro") Ĭonst poundField = document.querySelector(".pound") The other two is the euro and pound inputs from our HTML. The first one is the endpoint of Fixer api. Possible values are the ISO 4217 currency codes, such as 'USD' for the US dollar, 'EUR' for the euro, or 'CNY' for the Chinese RMB see the Current currency & funds code list. currency The currency to use in currency formatting. Takes either 'short' (default) or 'long'. We first start by setting our const we be using. compactDisplay Only used when notation is 'compact'. A few years back to center something vertically would either a css fudge or a Javascript solution. for getting exchange rates from some authentic external Currency API but I. Flexbox still amazes me how easy it is to center items vertically and horizontally. I believe shopify is also adding some sort of conversion fee that is not. To center the content I be using Flexbox and the properties jusitfy-content and align-center. Įnter your amount in Euro to see how much it is Poundsįor the background will be using a purple radial gradient. Finally we have a button to submit the conversion. Below is a link of what we aim to have built by the end of this tutorial.įor the HTML we have two inputs with type of number one for the euro and another one for the values in pound.
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |