Beginner 15 minutes

Build a Currency Converter

Create a simple currency converter with live exchange rates. Convert between any world currencies in real-time.

What You'll Build

A currency converter that fetches live exchange rates and converts amounts between any two currencies.

Prerequisites

  • Basic JavaScript knowledge
1

Get your API key

Sign up at exchangerate.host to get a free API key. The free tier provides daily updated rates for 100 requests per month.

2

List available currencies

Fetch the list of supported currencies to see what conversions are available.

javascript
const response = await fetch(
  'https://api.exchangerate.host/list?access_key=YOUR_API_KEY'
);
const data = await response.json();

console.log('Available currencies:');
Object.entries(data.currencies).slice(0, 10).forEach(([code, name]) => {
  console.log(`  ${code}: ${name}`);
});
console.log(`  ... and ${Object.keys(data.currencies).length - 10} more`);
3

Convert between currencies

Use the convert endpoint to convert an amount from one currency to another.

javascript
const from = 'USD';
const to = 'EUR';
const amount = 100;

const response = await fetch(
  `https://api.exchangerate.host/convert?from=${from}&to=${to}&amount=${amount}&access_key=YOUR_API_KEY`
);
const data = await response.json();

console.log(`${amount} ${from} = ${data.result.toFixed(2)} ${to}`);
console.log(`Rate: 1 ${from} = ${data.info.quote.toFixed(4)} ${to}`);
4

Build a reusable converter function

Create a function that handles multiple conversions and error cases.

javascript
async function convertCurrency(amount, from, to) {
  const response = await fetch(
    `https://api.exchangerate.host/convert?from=${from}&to=${to}&amount=${amount}&access_key=YOUR_API_KEY`
  );
  const data = await response.json();

  if (!data.success) {
    throw new Error('Conversion failed. Check currency codes.');
  }
  return {
    from: `${amount} ${from}`,
    to: `${data.result.toFixed(2)} ${to}`,
    rate: data.info.quote
  };
}

// Convert various amounts
const conversions = await Promise.all([
  convertCurrency(100, 'USD', 'EUR'),
  convertCurrency(100, 'USD', 'GBP'),
  convertCurrency(100, 'USD', 'JPY')
]);

conversions.forEach(c => {
  console.log(`${c.from} = ${c.to}`);
});

Next Steps

  • Add historical rate comparison
  • Build a multi-currency calculator UI
  • Add a chart showing rate trends over time