Building a currency tracker for travel expenses

Figma Cursor Claude Opus 4.6

In the last 3 months, I have studied JavaScript with a personal objective: to go beyond theory and build something real. I challenged myself to create a project to solve a personal problem, controlling my purchases in a foreign currency while traveling.

I pushed further into product design to deliver an end-to-end solution. I coded it myself with AI assistance to apply the concepts I learned (async functions, promises, error handling, API consumption, integrations, and creating endpoints).

Aplication

The web app should be capable of converting currency between ARS and BRL, and be integrated with a database that registers the purchase value, ID, type of purchase, exchange rate at the time of the transaction, and timestamp.

Backend

A simple Node.js application hosted on Render, responsible for providing the current exchange rate between ARS and BRL, registering purchases in the database, and retrieving all recorded purchases.

Backend architecture

Frontend + IA

The interface was designed in Figma and implemented using Figma's MCP. During development, I enhanced event handling (DOM event listeners) to improve UX and add animations.

Frontend implementation

I used Claude as my AI assistant for fetching data, making POST requests, endpoints, and working with sessionStorage.

AI-assisted development

Conclusion

This project reinforces something that has become increasingly evident: with study and AI, it is possible to transform ideas into products or businesses quickly.

Guilherme Marques