Skip to content

Preetham-iitb/Currency-converter

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

9 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Hi, myself Ganesh Preetham and this is my assignment for DevCom recruitments

I made a Currency Converter website using HTML, CSS and JavaScript. I'll explain about each of my file seperately. To open the website just open the index.html hile using any browser. No external packages required

HTML:- HTML is used to make the basic structure of the website. I've first imported 3 fonts into my file using url (Poppins, Lato, Open Sans) and linked my external CSS file. I had a basic view of the website in my head that a box will be floating in the website and a video related to money will be playing in background So I've took a stock video from online and used it in my website. Then in the boxes I've created will have input box, a drop down menu to select the fromCurrecny, convertedAmount, toCurrency and buttons to calculate exchange and to interchange the from and to currencies I prefer working with IDs more than classes since IDs are specific and give control on each element And at last, I've linked the JavaScript files also. (The list of countries are added with help of javascript file)

CSS:- I've choosen a particular shade of green which I feel, resembles green color on the dollar note. The whole website follows theme of this green and I feel it perfectly suited for the website The 2 buttons has a satisfying transition effect for them when we hover the mouse on them For most of the elements I used Poppins font and for the heading I used Lato font. All the boxes have rounded corners and overall I feel everything in the website feels smooth and pleasing to eyes.

JavaScript:- In the JavaScript file the first thing I've implemented is that if the user enters any non-positive input or leaves the input empty, as soon as the the input box is deselected, the input is automatically changed to 1 then using nested for loops, I made the default FROM currency as USD and default TO currency as INR also, in the same set of nested loops, I've entered all currency list to both the drop boxes Then using the addEventListener function, I've assigned the bottom left button for caluclating the result I've written exchangeRate() function to fetch the API, use the input value and API endpoints to calculate the final result. It's required to checkout the API doctumentation to know more about the endpoints of API we are using. I then set the decimal precision to 2 decimal places. I've also writtem comments in the code for better understanding.

This is my first proper website and a web development project. I've actually learned HTML, CSS and JavaScript everrything from scratch till what is needed for this website in a span of a week. As time pass by, I would definitely deep-dive into the world web development and improve my skills. Overall, I enjoyed this process of learning and making this website irrespective of future result and that's what it really matters

I hope you liked my website :) Thank You

About

No description, website, or topics provided.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published