Executive Summary
I built a full-stack travel planning platform that turns trip ideas into living, shareable itineraries. It’s a modern React app paired with a robust Express API that brings together real-time collaboration, weather insights, beautiful media, and optional AI-assisted itinerary generation.
The result is a planning experience that’s faster for teams, smarter for individuals, and production-ready for growth.
What I Delivered
A complete product: React 18 SPA with a clean Tailwind UI and an Express/MongoDB API
Real-time collaboration: Multi-user trip planning with Socket.IO events for comments, edits, reorder, and presence
Smart assistance: AI itinerary generation via OpenRouter (Claude 3.5 Haiku) with budget and interest personalization, plus graceful fallbacks when AI is unavailable
Reliable trip context: Live weather (current + 5-day) from OpenWeather; maps and places via OpenStreetMap stack (Nominatim, Overpass), plus destination imagery (Unsplash) and Cloudinary-based avatars/media
Operational hardening: JWT auth, helmet, rate limiting, environment-driven config, per-route validation, production-sensible CORS, and PDF/CSV/XLSX exports for offline use
Business Value for Clients
Faster conversions and engagement: Users can go from idea to itinerary in minutes, not days. Real-time collaboration keeps everyone aligned and coming back.
Differentiated UX: AI-assisted planning that adapts to budget and interests. Integrations add real value (accurate weather, rich media, places at a glance).
Lower operational risk: Secure defaults (JWT, helmet, rate limiting), safe public runtime config, and clear separation of concerns between client and server.
Scalable foundation: MongoDB with practical aggregations for analytics, route-level pagination and sorting, and clean service boundaries.
Core Features
Trip Planning and Itinerary Management
Create, update, reorder, and share itineraries; duplicate days; export to PDF/CSV/XLSX
Roles and sharing: owner, editor, viewer; team collaboration via Socket.IO rooms
Budget tracking and expenses CRUD
Weather and Context
Current conditions and 5-day summaries; city and coordinates endpoints
Proper error handling for rate limits, auth, and not-found cases
AI Itinerary Assistant
POST /api/ai/itinerary: Generates day-by-day JSON plans tailored by destination, duration, budget, and interestsUser-friendly client UX with AI modal and sensible fallbacks when AI is off
Media and Places
Cloudinary for avatars and image handling; Unsplash for destination photos
Places and geocoding via Nominatim/Overpass/Wikipedia with practical defaults and limits
Auth and Accounts
Registration/login/me endpoints; JWT bearer
Public share tokens for view-only trip links when enabled
Exports and Analytics
Exports: PDF, CSV, XLSX for itineraries
Dashboard-ready stats: totals, favorites, top regions, recent activity
Tech Stack and Architecture
Frontend
React 18 (CRA) with Tailwind; React Router; Recharts for visualizations
Leaflet + react-leaflet for maps
Socket.IO client for live collaboration
Cloudinary React SDK; html2canvas + jspdf for client-side conveniences when needed
Sensible dev setup: CRA proxy routes
/apito the server; runtime config fetched from/api/public-config
Backend
Express + MongoDB (Mongoose)
Helmet, express-rate-limit, and CORS with normalized origin checks
Socket.IO initialized on the HTTP server and scoped to trip rooms
Well-scoped routes: auth, trips, weather, images, places, hotels (Amadeus-ready with helpful TEST fallbacks), AI, guides, tools, currency, directions, public
Exports via pdfkit, json2csv, exceljs
Background tasks optional via
cron.js(notifications)
DevOps and Environment
.env-driven; safe/api/public-configendpoint exposes non-sensitive runtime values (e.g., Cloudinary cloud name/upload preset)Production-ready configuration: trust proxy for rate-limiting behind reverse proxy, error middleware, structured health endpoint (
/api/health)Vercel JSON present for flexible deployment patterns if desired
Notable Engineering Decisions
AI with Graceful Degradation
OpenRouter-backed AI generates structured JSON for deterministic parsing; if absent, a rule-based generator keeps the feature usable
Clear user messaging, loaders, and fallback suggestions keep the UX reliable even when external AI is unavailable
Real-Time Collaboration That Scales
Room-based events per trip keep updates scoped and efficient
Events include itinerary change types (added/updated/deleted/reordered), favorites toggles, day operations, comments, and receipt uploads
Secure, Pragmatic API Surfacing
JWT auth middleware; resource checks that validate both owner and member roles for sensitive operations
Rate limiting on
/apiand helmet across the boardDetailed error cases for OpenWeather, including 401/404/429 and user-facing messages
Strong Export and Share Story
PDF/CSV/XLSX exports allow offline planning and sharing outside the app
Public tokenized trip views enable frictionless client demos and user sharing while maintaining privacy controls
Developer Experience
CRA proxy simplifies local dev; server logs requests in non-production; config logs highlight missing envs early
Clear env examples in both client and server with a dedicated README to onboard quickly
Key Challenges Solved
Collaboration coherency:
The server ensures correct permissions on edit/share operations and emits consistent events; the client updates UI instantly to avoid conflicts.Ecosystem integration without API fragility:
For OpenWeather and Amadeus, the server provides specific error handling and safe fallbacks; Dev/test limits are handled without breaking the UX.Robust itinerary data model:
Reordering, day duplication, and per-day item ordering are supported with strong validation and fast updates.Media and config safety:
No secrets in the client; public runtime config endpoint powers safe Cloudinary usage with unsigned presets only when constrained appropriately.
Impact and Outcomes
Planning speed: Users generate structured, multi-day plans in seconds with AI, then fine-tune collaboratively.
Engagement: Real-time comments and edits keep teams coordinated; exports drive offline adoption and sharing.
Reliability: Rate limits, CORS, error middleware, and predictable external API handling reduce support noise and user frustration.
What I’d Build Next
Payments and pro features: Stripe-based plans for premium AI usage, export bundles, and advanced collaboration
Better geospatial UX: Distance matrix, driving/transit time estimates, and optimized visit order suggestions
Automated suggestions: Passive “next best place” recommendations driven by user behavior and preferences
Observability and QA: Centralized logging/metrics, integration tests for key routes, and E2E flows for itinerary collaboration
Mobile experience: Package a React Native or Flutter client using the same API for on-the-go editing
How I Work
I build systems that feel cohesive to end users and pragmatic to operate. I start from product value—what makes planning faster and more enjoyable—and then harden the fundamentals: structured data models, safe integrations, secure defaults, and a clean developer experience.
With Travel Planner, I focused on getting collaboration, context, and assistance right—so clients see a feature-complete, adaptable product rather than just a demo.