TRAVEL PLANNER
AI-Powered Itinerary Generator with Interactive Maps
The Problem Statement
“Generic travel planning tools either produce cookie-cutter itineraries with no personalisation or overwhelm users with options that require hours of curation. This full-stack travel planner bridges the gap by using Google Gemini AI to generate personalised day-by-day itineraries from a single preference input, while layering in interactive Leaflet maps, activity timelines, and one-click PDF export — turning AI-generated plans into shareable, printable travel documents in seconds.”
The Architecture Layout
The backend is a Node.js Express server that authenticates users via JWT tokens with bcrypt-hashed passwords stored in MongoDB Atlas. On itinerary generation, the server builds a structured prompt from user preferences and forwards it to the Google Gemini API, parsing the response into a normalised itinerary schema (activities, times, locations, descriptions). The React 18 TypeScript frontend uses Vite for fast builds, renders the itinerary as both a timeline view and an interactive Leaflet.js map with polyline connections and custom markers. Framer Motion drives smooth page and component transitions. jsPDF generates a structured PDF from the itinerary data on demand. Redux Toolkit manages global auth state and itinerary cache across the session.
Architecture Design Diagram
