DEV Community

Cover image for My first Scrimba web weekly challenge: currency exchange
yubaraj singh
yubaraj singh

Posted on

5 1

My first Scrimba web weekly challenge: currency exchange

I am currently enrolled in Scrimba's frontend master. I liked the teaching practice of Scrimba as they have an interactive teaching environment.In addition, they are doing a web weekly challenge and this week was a challenge to make a currency exchange page. link to challenge: link

so in order to solve this problem, I use a javascript query selector to select the input value and assigning the value to a variable.

const OriginalCurrencyAmount=document.getElementById('original-currency-amount')
const currencyUnit=document.getElementById('original-currency-unit')
const newCurrency=document.getElementById('new-currency-unit')
const exchangeRate=document.getElementById('exchange-rate')
const button=document.getElementById('exchange')

Enter fullscreen mode Exit fullscreen mode

After that, I had to make the button click work, so I added eventlistener in the button so when it is clicked then I will trigger a function to do the calculation and show the money exchange price.

button.addEventListener('click',function(){

})
Enter fullscreen mode Exit fullscreen mode

After that, I checked if the value is filled in the text box for validation. If the user clicked without filling in all the values then it will display a message to fill all values.

if(OriginalCurrencyAmount.value ==="" || currencyUnit.value ==="" || exchangeRate.value ==="" || exchangeRate.value ===""){
        document.getElementById('output-text').textContent=" please fill all values 💰"

    }
    else
   { var exchange=OriginalCurrencyAmount.value * exchangeRate.value
   document.getElementById('output-text').textContent=" your exchange rate of "+OriginalCurrencyAmount.value+ "💰 "+currencyUnit.value+ " will be "+ exchangeRate.value +" " +newCurrency.value+" currency"}
Enter fullscreen mode Exit fullscreen mode

So, if all the values are filled then it will calculate the money exchange value simply by multiplying the exchange rate with input currency value.

so here is my solution to the challenge.
link

Sentry blog image

How to reduce TTFB

In the past few years in the web dev world, we’ve seen a significant push towards rendering our websites on the server. Doing so is better for SEO and performs better on low-powered devices, but one thing we had to sacrifice is TTFB.

In this article, we’ll see how we can identify what makes our TTFB high so we can fix it.

Read more

Top comments (0)

AWS Q Developer image

Your AI Code Assistant

Automate your code reviews. Catch bugs before your coworkers. Fix security issues in your code. Built to handle large projects, Amazon Q Developer works alongside you from idea to production code.

Get started free in your IDE

👋 Kindness is contagious

If you found this post useful, please drop a ❤️ or leave a kind comment!

Okay