Globeplot - AI-Powered Travel Intelligence Platform

Globeplot is a next-generation travel orchestration platform that leverages AI to automatically extract structured data from travel documents and creates beautiful, interactive trip visualizations. Built with enterprise-grade architecture and modern web technologies.

🚀 Key Features

AI-Powered Document Intelligence

• Automatically extracts travel events from PDFs, emails, and images using Mistral AI
• Intelligent parsing of flights, hotels, activities, and reservations
• 90% reduction in manual data entry with 100% user control

Real-Time Interactive Mapping

• Mapbox GL integration with dynamic route visualization
• Intelligent coordinate clustering for overlapping locations
• Automatic geocoding with sub-100ms performance
• Visual travel narratives with chronological event flow

Collaborative Trip Sharing

• Cryptographically secure sharing with granular access controls
• Real-time collaboration
• Zero-downtime architecture supporting unlimited users

Production-Ready Architecture

• Firebase infrastructure with advanced security rules
• Intelligent rate limiting and cost controls
• Multi-tenant document management with automatic cleanup
• Responsive design from desktop to mobile

🛠️ Tech Stack

Frontend

• React 18 + Vite + TypeScript
• TailwindCSS + shadcn/ui components
• React Map GL (Mapbox integration)
• Zustand for state management
• Firebase SDK for real-time data

Backend

• Express.js API with TypeScript
• Firebase Admin SDK
• Mistral AI for document processing
• Rate limiting middleware
• Mapbox geocoding services

Infrastructure

• Firebase Firestore (database)
• Firebase Storage (file management)
• Firebase Authentication
• Cloudflare Pages (frontend)
• Render (backend)

🚀 Getting Started

Prerequisites

• Node.js (version 18+)
• Firebase project with Firestore/Storage enabled
• Mapbox access token
• Mistral AI API key

Installation

1. Clone the repository

   git clone https://github.com/yourusername/globeplot.git
   cd globeplot

2. Install dependencies

   # Frontend
   cd globe-plot-react
   npm install
   
   # Backend
   cd ../globe-plot-api
   npm install

3. Configure environment variables

   # Frontend (.env)
   VITE_FIREBASE_API_KEY=your_firebase_api_key
   VITE_MAPBOX_ACCESS_TOKEN=your_mapbox_token
   
   # Backend (.env)
   MISTRAL_API_KEY=your_mistral_api_key
   MAPBOX_ACCESS_TOKEN=your_mapbox_token

4. Start development servers

   # Frontend (localhost:5173)
   cd globe-plot-react && npm run dev
   
   # Backend (localhost:3001)
   cd globe-plot-api && npm run dev

📂 Project Structure

globeplot/
├── globe-plot-react/          # React frontend application
│   ├── src/
│   │   ├── components/        # Reusable UI components
│   │   ├── pages/            # Route components
│   │   ├── stores/           # Zustand state management
│   │   ├── lib/              # Utilities and services
│   │   └── styles/           # TailwindCSS styles
├── globe-plot-api/           # Express.js backend
│   ├── src/
│   │   ├── controllers/      # API route handlers
│   │   ├── services/         # Business logic
│   │   └── middleware/       # Rate limiting, auth
├── firestore.rules           # Firebase security rules