Overview

The CurrencyConverter is a React component that lets users convert between currencies using real-time exchange rates from an external API. It supports a fixed set of currencies (USD, EUR, GBP, JPY, CAD) and updates conversions instantly as users interact.

Key Features

• Fetches live exchange rates on load
• Converts values in real time using useMemo
• Handles source/target currency changes with useCallback
• Includes a reset button to return to defaults
• Displays an error if data fails to load in 5 seconds

How It Works

Users can input an amount, choose their source and target currencies, and see the converted amount update instantly. The calculation is based on the formula: the entered amount multiplied by the ratio of target to source exchange rates. The app responds immediately to input and selection changes, thanks to React’s memoization and state hooks.

It includes basic error handling—a loading failure after 5 seconds will trigger an error message. Overall, this is a functional and efficient component built with a clean React architecture and hooks-based logic.