Skip to main content

Transform trip planning with AI assistance

TripLoom is an AI-powered travel platform that helps you plan, book, and manage trips with intelligent automation. Search flights with SerpAPI Google Flights integration, build day-by-day itineraries with drag-and-drop, track real-time flight status, and collaborate with group travelers—all in one place.

Quickstart

Get from signup to your first trip in under 5 minutes

Authentication

Set up Supabase authentication with email/password and OAuth

Flight search

Integrate SerpAPI for live Google Flights search and booking

Itinerary builder

Build dynamic day-by-day plans with drag-and-drop calendar

Core features

Flight search & booking

Powered by SerpAPI Google Flights, TripLoom surfaces best flight options across one-way, round-trip, and multi-city routes. Compare offers by price, duration, and stops—then save your selection to the trip.
/home/daytona/workspace/source/frontend/app/api/flights/serp/search/route.ts
export async function POST(request: Request) {
  const apiKey = getSerpApiKey()
  if (!apiKey) {
    return NextResponse.json(
      { ok: false, error: "SerpAPI flight search unavailable. Set SERPAPI_API_KEY in env." },
      { status: 503 }
    )
  }

  // Parse request body with slices, adults, cabin_class
  const body = await request.json()
  const slices = body.slices // [{ origin, destination, departure_date }]
  
  // Call SerpAPI
  const params = new URLSearchParams({
    engine: "google_flights",
    api_key: apiKey,
    departure_id: slices[0].origin,
    arrival_id: slices[0].destination,
    outbound_date: slices[0].departure_date,
  })
  
  const res = await fetch(`${SERPAPI_BASE}?${params.toString()}`)
  const data = await res.json()
  
  return NextResponse.json({ ok: true, offers: data?.best_flights ?? [] })
}

Real-time flight status

Track any flight by number and date. TripLoom fetches live departure/arrival times, gate info, delays, and airline logos.

Day-by-day itinerary builder

Drag-and-drop events across a calendar, assign time blocks (morning/afternoon/evening), and export to Google Calendar in batch.
/home/daytona/workspace/source/frontend/lib/trips.ts
export type TripItineraryItem = {
  id: string
  tripId: string
  dayIndex: number
  timeBlock: ItineraryTimeBlock // "morning" | "afternoon" | "evening"
  status: ItineraryStatus // "planned" | "todo" | "finished"
  category: ItineraryCategory // "sightseeing" | "food" | "commute" | etc.
  title: string
  locationLabel: string
  startTimeLocal?: string
  endTimeLocal?: string
  notes?: string
  sortOrder: number
}

AI-powered trip assistant

Chat with the AI to generate itinerary suggestions, find transit routes, or refine your plan based on preferences.

Transit routing with Google Maps

Search and save transit routes between destinations with estimated duration, cost, and transfer details.

Group travel management

Invite travelers, manage approvals, and split expenses with equal or custom allocation.

Multi-currency budget tracking

Set a trip budget, log expenses by category (flights, hotels, food, activities), and track spending pace with automated guardrails.
/home/daytona/workspace/source/frontend/lib/trips.ts
export type TripFinance = {
  budgetTotal: number
  currency: string
  groupModeEnabled: boolean
  groupSize: number
  exchangeRates: Record<string, number>
  expenses: TripExpense[]
  automation: TripFinanceAutomation
}

Technology stack

Next.js 15

App Router with server and client components

Supabase

PostgreSQL database with Row Level Security and real-time subscriptions

TypeScript

End-to-end type safety across frontend and API routes

SerpAPI

Google Flights search integration

Tailwind CSS

Utility-first styling with custom design system

React Big Calendar

Drag-and-drop itinerary scheduling

Get started

1

Clone the repository

git clone https://github.com/yourusername/triploom.git
cd triploom/frontend
2

Install dependencies

npm install
3

Configure environment

Create .env.local and add your Supabase and SerpAPI keys:
NEXT_PUBLIC_SUPABASE_URL=https://your-project.supabase.co
NEXT_PUBLIC_SUPABASE_ANON_KEY=your-anon-key
SERPAPI_API_KEY=your-serpapi-key
4

Run the development server

npm run dev
Open http://localhost:3000
Need help getting started? Check out the Quickstart guide for a complete walkthrough.

Build docs developers (and LLMs) love