-- Inspiration --
Planning a trip means bouncing between Google Maps, TripAdvisor, restaurant sites, and hotel listings for hours and still ending up with a disorganized list of tabs. We wanted to collapse that entire process into a single conversation: tell us where you're going, and walk away with a complete, day-by-day plan that actually fits how you travel.
-- What it does --
DUX is an AI-powered travel planner that generates personalized day-by-day itineraries for Canadian cities. You pick your destination, trip length, number of travelers, budget tier, travel pace, and interests — DUX produces a full schedule in seconds, broken into Morning / Afternoon / Evening slots with real venues, walking-time estimates between stops, and per-activity cost breakdowns.
From there, every part of the itinerary is editable: drag activities between time slots or reorder them within a slot, swap any activity for a similar AI-suggested alternative, or delete activities you don't want. A "Refine" bar lets you reshape the whole trip in plain language ("more food," "cheaper," "more nightlife"). An interactive Leaflet map shows your route for each day with travel-time labels on each segment, and can expand to fullscreen. When you're done, a single Share button generates a print-ready PDF where each day is its own page.
-- How we built it --
DUX is a Next.js 15 App Router application with a TypeScript frontend and a Node/Express backend connected to MongoDB. The backend stores a curated database of real venues with coordinates, categories, ratings, pricing tiers, and opening hours. The frontend calls our own API routes, which score and filter venues from the database before passing them to Gemini or Anthropic (configurable via environment variable) to generate structured JSON itineraries. A separate refinement route handles natural-language edits using the same AI stack. Maps are rendered client-side with Leaflet.js, with haversine-formula walking-time calculations between stops.
-- Challenges we ran into --
Getting the AI to produce valid, schema-conforming JSON consistently — especially across multi-day itineraries without repeating venues across days — required careful prompt engineering and a client-side deduplication safety net. Implementing reliable drag-and-drop across time slots in React required a deferred-mutation pattern (queueing DOM changes in a ref and committing them only on dragend) to prevent the browser from losing its drag connection mid-gesture.
-- Accomplishments that we're proud of --
A complete trip plan — with real venues, a mapped route, cost estimates, and walking times — generated in under five seconds. The drag-and-drop editor that lets you reshape a day's schedule without touching the AI. The fullscreen interactive map with animated segment labels. And a Share button that produces a clean, printable PDF with one day per page, no extra dependencies.
-- What we learned --
Prompt engineering for structured output at scale, the subtleties of the HTML5 Drag and Drop API in React, how to build a reliable AI fallback pipeline, and how much polish you can ship in a hackathon when the core loop is tight.
-- What's next for DUX --
Expanding beyond Canadian cities, adding hotel and flight suggestions, collaborative trip planning (share a link, edit together), real-time local event integration, and budget tracking that accumulates costs across all days automatically.
Built With
- mongodb
- next.js
- tailwind
- typescript
Log in or sign up for Devpost to join the conversation.