Menu Close

currency-converter

Currency Converter

Description

This is a React-based web application that enables users to convert between two currencies using real-time exchange rates sourced from the openexchangerate API. Additionally, it includes a Progressive Web App (PWA) for enhanced user experience and convenience.

Site

Here is a link to the site hosted on Netlify.

Installation

  1. Clone the repository or download the project files.
  2. Install the required dependencies using npm install.
  3. Start the application using npm start.
  4. Open your web browser and navigate to http://localhost:3000/ to view the application.

Usage

  1. Select the starting currency from the first drop-down list.
  2. Enter the amount to be converted in the input field next to the first drop-down list.
  3. Select the currency to which you want to convert from the second drop-down list.
  4. The converted amount will be displayed in the input field next to the second drop-down list.
  5. The exchange rate will be displayed in the middle, between the two drop-down lists.
  6. Click the “Swap” button to switch the starting and target currencies.
  7. Click the “Clear” button to reset the inputs.

Technologies Used

  • React
  • JavaScript
  • HTML
  • CSS

Credits

This project was built by Ori Baram. The exchange rates are provided by the openexchangerate API.

This project was initially implemented with Vanilla JavaScript as part of the “20 Web Projects With Vanilla JavaScript” course by Brad Traversy. In this project, I have refactored the original implementation and rewritten it in React.

View Source Code
Posted in Development