← Back to projects

Travel · Finance

Voyage Watch
Because the best price rarely lives on just one site

Year 2026
Stack React · Vite · Claude API
Deployed via Vercel
Live site View project →
01

The Original Prompt

The exact words I gave Claude to kick this off.

Create a web app that tracks deals and bundles for specific locations or hotels. This acts like a price tracking alert, where users can add hotels or locations. Alerts will be sent when there is a deal or cost is low.

I want to add specific resorts like The Westin Ka'anapali Ocean Resort Villas or specific cities, like Maui. I will have a custom dashboard that searches across multiple sites (Expedia, Hotels.com, Marriott.com) and tells me the best time to book and cost (reward points, packages, or cash).

Update so that I can add in filters for specific types of rooms and can compare prices. When adding in a location, list the top 5 hotels and type of rooms.

Yes add in a date range picker and also keep the ability to add in a specific hotel too. Update the aesthetic so that it is fresh, calm, tropical and light. Minimum font size should be 12 and optimise for accessibility. Create folder to house trips so that I can group cities or hotels. Update the links for best cash, best package, and best points to link and open in a new tab so that I can book.

02

Explain It Like I'm 5

How it works, why it was built this way, and the thinking behind each decision.

⚙️

What it does

Voyage Watch is a personal travel planning dashboard that tracks hotel prices across five booking platforms — Expedia, Hotels.com, Marriott Bonvoy, Booking.com, and World of Hyatt — all at once. You add destinations or specific resorts to a watchlist, pick your travel dates, choose your room type, and the app shows you the cheapest place to book, the best package deal including flights, and how many loyalty points you'd need to redeem. An AI "analyse" button explains whether your dates are good value and whether cash or points is the smarter play.

🧱

How it's built

It's a React app built with Vite — a single JSX file containing all the components, from the date picker calendar to the price comparison tables. The Claude API powers the "AI Intelligence" feature: when you click Analyse, it sends hotel details and your travel dates to Claude and streams back three plain-English booking tips. A small serverless proxy function sits between the app and Anthropic's API so the API key never touches the browser. Everything is deployed to Vercel, which handles the serverless function automatically on every GitHub push.

🤔

Why this approach

React was chosen because the UI is deeply interactive — room type filters, date pickers, collapsible hotel cards, and trip folders all update each other in real time. Keeping everything in a single App.jsx file was a deliberate tradeoff: it makes the project easy to hand off or iterate on without a complex folder structure. Pricing is currently simulated with a seeded random function rather than a live API — this kept the build fast and functional while the UX was being refined, with a clear path to swap in real data later. The tropical light aesthetic (cream, teal, seafoam) was a deliberate departure from the typical dark "finance dashboard" look — the goal was something that felt like planning a holiday, not tracking a stock portfolio.

🚀

How it's deployed

The project was packaged as a Vite + React app and pushed to GitHub. Vercel connects directly to the repo and builds automatically on every push — no manual steps after the initial setup. The Anthropic API key is stored as an environment variable inside Vercel's dashboard, never in the codebase. A api/messages.js serverless function acts as a secure proxy, validating and forwarding requests to Anthropic's API so the key is never exposed to users. The whole deployment — from zip file to live URL — takes about 60 seconds.

03

What's Next

Where this project could go with more time and feedback.

Near-term

Connect a real hotel pricing API (Amadeus or RapidAPI Hotels) to replace the simulated prices with live rates. The roomPrice() function is the only thing that needs to change — the rest of the UI already handles real data correctly. Adding price change alerts via email or push notification would complete the original "price tracker" concept.

Medium-term

Add user accounts and persistent storage so trip folders and watchlists survive across sessions and devices. Supabase would be the natural fit here — it would also enable price history tracking, so the app could show whether a rate is genuinely low or just normal for that property at that time of year. A side-by-side hotel comparison view (select two or three hotels and see all their room types and source prices in a single table) would also significantly improve the booking decision flow.

Ambitious

A mobile app with push notifications that fires when a tracked hotel drops below a set price threshold — the original alert concept fully realised. Long-term, the AI layer could be trained on personal booking history to learn your actual preferences (you always pick ocean view, you never use hotel parking) and weight recommendations accordingly. There's also a version of this that plugs directly into loyalty programme accounts via OAuth to show your real points balance and calculate exactly how many nights you could redeem for free — no manual entry required.

04

Share Your Thoughts

Feedback, ideas, and questions are welcome — I read everything.

Responses go to a private Google Sheet — no spam, ever.