Project Info
Inspiration
When people travel, they switch between many apps : Google Maps and places for directions and exploring places. Zomato for food order. District for places to visit. MakeMyTrip for hotels and transport booking . This is such a waste of time.
What it does
Our web app does everything important but in an easy way . Suppose a user enters: "I want to go from Digha to Newtown." The app shows ✅ Safest route ✅ Traffic ✅ Accident-prone areas ✅ Road construction ✅ Flooded roads (if available) ✅ Nearby restaurants ✅ Nearby cafes ✅ Tourist attractions ✅ Budget hotels ✅ Bus/train/flight options Everything under one specific platform .
How we built it
Frontend: A modern web interface built using React and Vite for rapid rendering and hot module reloading. It uses Tailwind CSS and modular UI components for a premium, responsive design, along with interactive maps to visualize locations and hotel recommendations. Backend: A lightweight Node.js and Express server that handles client requests, communicates with external APIs, and manages a local JSON database to save, update, and retrieve generated travel itineraries. AI Engine: Powered by the OpenAI API (using models like gpt-4o-mini). The AI dynamically processes user preferences (such as destination, budget, travel companion type, and trip duration) to structure detailed day-by-day itineraries, estimate costs, and power an interactive, context-aware chatbot assistant to answer traveler queries.
Challenges we ran into
JSON Parsing Failures: Sometimes the AI returned Markdown or conversational text alongside the itinerary data. Solved by using strict prompts to enforce a clean JSON schema. Serverless File Storage: Serverless hosting (like Vercel) has a read-only filesystem, preventing local database writes. Solved by routing file database writes to the environment's temporary directory (/tmp). AI Latency: Generating a detailed multi-day plan takes a few seconds, which can hurt UX. Solved by implementing visual loading states and skeleton screens. Chatbot Context Limits: Feeding the entire itinerary details into the chat companion for every message was inefficient. Solved by compressing the trip details into a compact system context. Coordinate Inaccuracy: The AI would occasionally generate inaccurate latitude/longitude values for map pins. Solved by validating coordinates before rendering the map.
Accomplishments we're proud of
Zero-to-Hero Travel Planning: Users can generate a complete, fully customized multi-day vacation plan under 10 seconds. Context-Aware Chat Companion: The AI assistant doesn't just chat. It understands the generated itinerary, allowing users to ask context-specific questions about their current trip. Seamless Map & Itinerary Sync: Successfully mapping out travel activities visually, creating a seamless dual-view experience. Polished User Experience: Achieving a premium, highly responsive UI/UX, smooth loading skeletons, and interactive states. Serverless-Ready Deployment: Building a production-ready application that works out-of-the-box on serverless environments, making it cheap to host and highly scalable.
What we learned
Prompt Engineering & Output Control: We learned how to write system instructions that constrain LLMs (such as OpenAI) to return structured JSON rather than raw text, thereby avoiding runtime crashes. Designing for API Latency: We discovered how critical perceived performance is; using placeholder skeletons and engaging loaders drastically improves the user experience while waiting for AI generation. Managing Ephemeral Environments: We gained a solid understanding of how serverless platforms (like Vercel) manage storage and routing, forcing us to write adaptive data-saving logic using /tmp. Effective Context Management: We learned how to pass large datasets into LLM chat models efficiently without hitting rate limits or driving up API token costs. Integrating AI with Interactive Maps: We learned how to bridge structural text coordinates returned by an AI with frontend mapping APIs to display dynamic, interactive visual components.
What's next
Direct Booking Integration: Connect with flight and hotel APIs (like Skyscanner or Amadeus) to allow users to book their generated recommendations directly inside the app. Real-Time Collaborative Planning: Add support for shared workspaces, allowing friends or families to edit and plan the same itinerary together in real time. Offline Mode & PWA Support: Enable travelers to download itineraries offline or export them to PDF, ensuring access to schedules and maps even without cellular data. Expense & Budget Tracker: Integrate a live budgeting feature where users can log actual expenses during their trip and compare them to the AI's initial estimate. Community Hub & Social Sharing: Allow users to publish their generated itineraries to a community feed where other travelers can browse, upvote, and customize them.
React + Vite
This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.
Currently, two official plugins are available:
- @vitejs/plugin-react uses Oxc
- @vitejs/plugin-react-swc uses SWC
React Compiler
The React Compiler is not enabled on this template because of its impact on dev & build performances. To add it, see this documentation.
Expanding the ESLint configuration
If you are developing a production application, we recommend using TypeScript with type-aware lint rules enabled. Check out the TS template for information on how to integrate TypeScript and typescript-eslint in your project.
✈️ Travlr AI: Next-Gen AI Travel Planner
Travlr AI is an advanced, full-stack travel planner designed to transform how users discover, organize, and experience their journeys. By combining dynamic frontend mapping, serverless backend technology, and state-of-the-art AI language models, Travlr AI generates detailed, context-aware itineraries in seconds.
🤖 The AI Engine: GPT-5.6 & Codex Integration
At the core of Travlr AI's intelligence is a multi-model orchestration powered by OpenAI's advanced AI stack:
🌟 GPT-5.6 (Itinerary & Chat Intelligence)
We leverage GPT-5.6 to act as the primary brain of the application. It processes complex user inputs—including duration, budget levels, destinations, and traveler dynamics—to synthesize logical, high-fidelity day-by-day travel schedules.
- Dynamic Decision Making: GPT-5.6 selects the highest-rated local hotels and maps out chronological daily activities that minimize transit time.
- Context-Aware Chat Companion: The model powers our interactive chat assistant, maintaining complete context of the user's specific trip to provide instant recommendations, historical facts, and itinerary adjustments in real-time.
💻 OpenAI Codex (Structured Mapping & Translation Layer)
We utilize OpenAI Codex as a backend processing engine to ensure seamless translation between raw language generation and database-ready code schemas.
- Schema Validation & Parsing: Codex assists in programmatically validating JSON outputs, ensuring that coordinate pairs (latitude and longitude) are correctly formatted for the map rendering component.
- Adaptive Routing Routines: Codex-driven routines dynamically optimize routing sequences between activities to minimize physical distance, ensuring the generated plan is mathematically viable.
🛠️ Technology Stack
- Frontend: React 19, Vite, Tailwind CSS v4, Shadcn UI / Base UI
- Backend: Node.js, Express.js
- Database: Lightweight JSON database adapted for ephemeral and serverless environments
- Maps & Geo-visuals: Leaflet Maps & Google Maps API integration (
@vis.gl/react-google-maps) - Deployment: Pre-configured for serverless platforms like Vercel and web service deployment on Render
🚀 Key Features
- Zero-to-Hero Travel Planning: Generate custom multi-day plans with itineraries, budget estimates, and curated hotel recommendations in under 10 seconds.
- Visual Map Synchronization: Live dual-pane view mapping schedule activities to interactive pins alongside written schedules.
- Interactive AI Chat Companion: Ask contextual questions directly about your trip and get instant, customized suggestions.
- Aesthetic & Responsive Design: Premium user interface with smooth animations, dark-mode styling, and skeleton loading screens.
🧠 Challenges Overcome
- Output Schema Consistency: Prevented parser crashes by training GPT-5.6 prompts to strictly output schema-compliant JSON, filtering out markdown wrappers.
- Serverless Read-Only Storage: Overcame Vercel's ephemeral write restrictions by routing the JSON database dynamically to local
/tmpstructures. - UX Latency Mitigation: Designed placeholder skeletons and loading progress states to mask the generation time of complex itineraries.
🏆 Accomplishments
- Seamless orchestration of GPT-5.6 for multi-variable itinerary generation.
- Robust, highly optimized context compression for the companion chatbot.
- Single-command deployment pipeline configured for cloud services.
Analysis
View
Metric
- 8
Figures cover GitHub contributors during the hackathon window. A co-authored commit counts in full for each author, so per-member totals add up to more than the whole-team figures.
Technology
- CSSIn code
- ExpressIn code
- Google GeminiIn code
- HTMLIn code
- JavaScriptIn code
- ReactIn code
- Tailwind CSSIn code
- Node.jsClaimed
- OpenAIClaimed
- VercelClaimed
7 of 10 appear in the indexed code. 3 claimed on Devpost could not be matched to code, which may simply mean the tool leaves no trace in the repository.
AI coding agents
No AI coding agent signals were found in this repository.
Detected from committed agent config files and commit authorship. Absence of a signal is not proof an agent was unused.
Codebase size
Source size
99 KB
Source files
20
Counts recognized source files only; vendored directories, binaries and lockfiles are excluded, so this is smaller than the repository on disk.
Repository
SHREYOTHECODINGEXPERTO/TRAVLR-AI
34 files · 18.3 MB · @ 6a516bf
Structure
Interface
4 files · 12%Screens, components and styles rendered to the user.
API & routing
3 files · 9%Request entry points: routes, handlers and controllers.
Application logic
10 files · 29%Domain rules, services and shared utilities.
+1 more
Supporting
Layers are inferred from where files sit in the tree, not from reading the code. A project that names its directories unconventionally will read oddly here — open the file browser to check anything the diagram implies.
Languages
- JavaScript87%
- CSS7%
- Markdown5%
- HTML0%
- YAML0%
Share of indexed source by file size. Binary and vendored files are excluded.
Dependencies
package.json
npm · 31- @base-ui/react
- @fontsource-variable/geist
- @google/generative-ai
- @tailwindcss/vite
- @vis.gl/react-google-maps
- class-variance-authority
- clsx
- cors
- dotenv
- express
- leaflet
- lucide-react
- react
- react-dom
- react-router-dom
- react-select
- shadcn
- tailwind-merge
- +13 more
Declared in the repository’s manifests at the indexed commit. A declared package is not proof it is used, and runtime dependencies are listed first.
This project’s features have not been analysed yet.
Export this project's context (description, README, evidence, key source files) to chat with an AI agent elsewhere.