Building a Real-Time Currency Converter for Travel Apps
Building a Real-Time Currency Converter for Travel Apps Every traveler needs to convert currencies. Here's how I built a real-time converter for ViajApp. The Problem When you're in Japan, you need to quickl
Building a Real-Time Currency Converter for Travel Apps
Every traveler needs to convert currencies. Here's how I built a real-time converter for ViajApp.
The Problem
When you're in Japan, you need to quickly convert yen to your home currency. mental math is hard, and most apps require internet.
The Solution
A currency converter that:
- Updates rates daily
- Works offline
- Shows historical trends
- Has a clean UI
Implementation
Backend (FastAPI)
@router.get("/convert")
async def convert_currency(
from_currency: str,
to_currency: str,
amount: float
):
rate = get_exchange_rate(from_currency, to_currency)
converted = amount * rate
return {
"from": from_currency,
"to": to_currency,
"amount": amount,
"rate": rate,
"converted": round(converted, 2)
}
Frontend (Next.js)
const convertCurrency = async (amount: number) => {
const res = await fetch(
`/api/v1/currency/convert?from=${from}&to=${to}&amount=${amount}`
);
const data = await res.json();
setConverted(data.converted);
};
Features
- 10 currencies: JPY, EUR, USD, GBP, KRW, etc.
- Daily updates: Rates refresh every 24 hours
- Offline support: Last known rates cached
- Quick presets: "How much is 1000 yen?"
Lessons
- Cache everything: API calls are slow, cache is fast
- Show the rate: Users want to see the exchange rate, not just the result
- Round properly: Money should always show 2 decimal places
Try it: viajapp.app/currency
📰 Read the original article on Dev.to WebDev
Originally published by Dev.to WebDev. Aggregated on AIWithGhost for educational purposes — full credit and traffic to the original publisher.