Skip to content

Agarwalchetan/Atlasia

Repository files navigation

Atlasia

AI-powered global travel intelligence platform — built with Next.js 16, React 19, and a multi-provider AI system.

Atlasia gives travelers real-time AI translations, phrase generation with pronunciation audio, cultural intelligence, trip itineraries, an interactive world map, and emergency contact lookup — all in one app, deployable in minutes.


Table of Contents


Features

Page Route Description
Home / Landing page with animated stats, feature showcase, and quick-access CTAs
Map /map Full-bleed interactive world map — search locations, filter by category, explore nearby places
Travel Guide /travel-guide AI destination guide, day-by-day itinerary generator, and cultural intelligence
Phrases /phrases AI phrase generator with phonetic pronunciation and text-to-speech audio
Conversation /conversation Live bilingual translator with microphone input and TTS playback
Emergency /emergency Emergency phrase translator, country-specific emergency numbers, medical alert card
Survival Card /survival-card Per-country card: tap-to-call emergency numbers, 6 survival phrases with TTS, local rules, payment info, safety tips
Food Explorer /food-explorer 6–8 iconic dishes per destination with flavour profiles, dietary tags, price range, and ordering phrases with TTS
Ask Atlasia /chat Multi-turn AI travel chat with destination context, markdown rendering, and 8 suggested questions

Highlights

  • Zero-config map — works out of the box with Leaflet + OpenStreetMap. Add a free MapTiler key to unlock 3D globe projection.
  • Multi-provider AI — switch between OpenAI, Google Gemini, and Groq with a single environment variable. No code changes.
  • 15 languages — translation, phrase generation, and UI localization across 15 languages. Browser language auto-detected on first visit.
  • No paid map APIs required — geocoding via Nominatim, nearby places via OpenStreetMap Overpass API.
  • Privacy-first — no analytics, no tracking. All API keys are server-side only.

Tech Stack

Category Technology
Framework Next.js 16 (App Router, serverless)
Runtime React 19
Styling Tailwind CSS v4
Animations Framer Motion v12
Icons Lucide React + @iconify/react (flag icons)
UI Primitives Radix UI
Fonts Sora (headings) · Inter (body) · DM Mono (pronunciation)
AI — Text OpenAI / Google Gemini / Groq (switchable)
AI — TTS OpenAI tts-1
AI — STT OpenAI Whisper or Groq Whisper
Map MapLibre GL (3D globe) + Leaflet/OSM fallback
Geocoding Nominatim (free, no key)
Nearby Places OpenStreetMap Overpass API (free, no key)
Localization Lingo.dev SDK
Package Manager Bun

Project Structure

atlasia/
├── src/
│   ├── app/
│   │   ├── api/
│   │   │   ├── translate/              # Text translation endpoint
│   │   │   ├── translate-ui/           # UI string localization (Lingo.dev)
│   │   │   ├── phrases/                # Travel phrase generation
│   │   │   ├── travel-guide/           # Destination travel guide
│   │   │   ├── itinerary/              # Day-by-day trip itinerary
│   │   │   ├── cultural-intelligence/  # Cultural tips and etiquette
│   │   │   ├── nearby-places/          # OSM Overpass nearby POI lookup
│   │   │   ├── chat/                   # Ask Atlasia AI chat
│   │   │   ├── food-explorer/          # Food Explorer dish generation
│   │   │   ├── survival-card/          # Travel Survival Card generation
│   │   │   └── speech/
│   │   │       ├── transcribe/         # Speech-to-text (STT)
│   │   │       └── tts/                # Text-to-speech (TTS)
│   │   ├── map/                        # /map page — full-bleed world map
│   │   ├── travel-guide/               # /travel-guide page
│   │   ├── phrases/                    # /phrases page
│   │   ├── conversation/               # /conversation page
│   │   ├── emergency/                  # /emergency page
│   │   ├── chat/                       # /chat page — Ask Atlasia AI chat
│   │   ├── food-explorer/              # /food-explorer page
│   │   ├── survival-card/              # /survival-card page
│   │   ├── globals.css                 # Tailwind v4 theme, custom animations
│   │   ├── layout.tsx                  # Root layout — fonts, metadata, ClientLayout
│   │   └── page.tsx                    # Home page
│   ├── components/
│   │   ├── layout/
│   │   │   ├── navbar.tsx              # Top navigation bar
│   │   │   └── client-layout.tsx       # Conditionally hides navbar on /map
│   │   ├── map/
│   │   │   ├── map-component.tsx       # Orchestrator shell
│   │   │   ├── map-canvas.tsx          # MapLibre GL renderer
│   │   │   ├── map-leaflet-canvas.tsx  # Leaflet fallback renderer
│   │   │   ├── map-icon-rail.tsx       # Left navigation rail (Google Maps-style)
│   │   │   ├── map-search-bar.tsx      # Floating pill search bar
│   │   │   ├── map-category-pills.tsx  # Horizontal category filters
│   │   │   ├── map-place-panel.tsx     # Sliding place detail panel
│   │   │   ├── map-controls.tsx        # Zoom / location / street view controls
│   │   │   ├── map-types.ts            # Shared types and constants
│   │   │   └── map-geocoding.ts        # Nominatim geocoding utilities
│   │   └── ui/
│   │       ├── button.tsx
│   │       ├── card.tsx
│   │       ├── badge.tsx
│   │       ├── input.tsx
│   │       ├── select.tsx
│   │       ├── tabs.tsx
│   │       └── loading.tsx
│   ├── lib/
│   │   ├── ai-provider.ts              # Unified AI provider abstraction
│   │   ├── lingo.ts                    # Lingo.dev localization helper
│   │   ├── language-context.tsx        # Global language state (React context)
│   │   ├── use-translations.ts         # useTranslations hook
│   │   └── utils.ts                    # cn(), SUPPORTED_LANGUAGES, PHRASE_CATEGORIES
│   └── types/
│       └── index.ts
├── .env.example                        # Environment variable template
├── vercel.json                         # Vercel deployment config (bun, timeouts)
├── next.config.ts                      # Next.js config
├── postcss.config.mjs                  # Tailwind v4 PostCSS plugin
├── tsconfig.json
└── package.json

Getting Started

Prerequisites

1. Clone and install

git clone https://github.com/AgarwalChetan/Atlasia.git
cd Atlasia
bun install

2. Configure environment variables

cp .env.example .env.local

Open .env.local and fill in your keys. The minimum required set:

USE_OPENAI=true
OPENAI_API_KEY=sk-...

See the full Environment Variables reference below.

3. Run the development server

bun dev

Open http://localhost:3000.

4. Build for production

bun run build
bun start

Environment Variables

Copy .env.example to .env.local. All server-side variables are never exposed to the browser.

AI Provider

Exactly one provider flag should be true. When multiple are true, priority is: OpenAI → Gemini → Groq.

Variable Default Description
USE_OPENAI true Use OpenAI for text generation
USE_GEMINI false Use Google Gemini for text generation
USE_GROQ false Use Groq for text generation

API Keys

Variable Required Description
OPENAI_API_KEY Always required Used for TTS (tts-1) on every page. Also needed for text generation when USE_OPENAI=true and for STT when SPEECH_PROVIDER=openai.
GEMINI_API_KEY If USE_GEMINI=true Google AI Studio API key
GROQ_API_KEY If USE_GROQ=true or SPEECH_PROVIDER=groq Groq Cloud API key

Model Overrides (optional)

Variable Default Description
OPENAI_MODEL gpt-4o-mini Override the OpenAI text model
GEMINI_MODEL gemini-2.0-flash Override the Gemini model
GROQ_MODEL llama-3.3-70b-versatile Override the Groq model

Speech

Variable Default Description
SPEECH_PROVIDER openai STT provider: openai (Whisper-1) or groq (Whisper-large-v3, free tier)

Map

Variable Required Description
NEXT_PUBLIC_MAPTILER_KEY Optional Enables 3D globe via MapLibre GL. Get a free key at maptiler.com. Without this the map falls back to Leaflet + OpenStreetMap automatically.

Localization

Variable Required Description
LINGO_DEV_API_KEY Optional Lingo.dev key. Enables multilingual UI. Without it, UI stays in English.

App

Variable Default Description
NEXT_PUBLIC_APP_URL http://localhost:3000 Set to your production URL in deployment
ELEVENLABS_API_KEY Reserved for future enhanced TTS, not used yet

AI Provider System

All text generation is routed through a unified abstraction at src/lib/ai-provider.ts. It reads the USE_* flags at runtime — no code changes needed to switch providers.

USE_OPENAI=true  →  openai SDK       (gpt-4o-mini by default)
USE_GEMINI=true  →  @google/generative-ai  (gemini-2.0-flash by default)
USE_GROQ=true    →  groq-sdk         (llama-3.3-70b-versatile by default)

TTS is always OpenAI. The /api/speech/tts route uses openai.audio.speech.create() with tts-1 regardless of the text provider selection. This means OPENAI_API_KEY must always be set.

STT is configurable. Set SPEECH_PROVIDER=groq to use Groq's free Whisper tier for speech-to-text transcription.


Map System

The map auto-selects its rendering mode based on whether NEXT_PUBLIC_MAPTILER_KEY is set:

Mode Condition Tiles Projection
MapLibre GL NEXT_PUBLIC_MAPTILER_KEY is set MapTiler dark theme 3D globe
Leaflet fallback No MapTiler key OpenStreetMap + CARTO dark 2D flat

Both modes support:

  • Click-to-select any location
  • Search via Nominatim geocoding (free, no key)
  • Nearby places (attractions, restaurants, museums, hotels, hospitals, pharmacies, ATMs, transit) via Overpass API (free, no key)
  • Google Maps-style layout: icon rail, floating search bar, category filters, sliding place panel, map controls

API Routes

All routes are Next.js App Router Route Handlers.

Route Method Env Vars Description
/api/translate POST AI provider vars Translates text between two languages
/api/translate-ui POST LINGO_DEV_API_KEY Translates UI strings via Lingo.dev
/api/phrases POST AI provider vars, LINGO_DEV_API_KEY Generates categorized travel phrases with phonetics
/api/travel-guide POST AI provider vars, LINGO_DEV_API_KEY Generates a rich travel guide for a destination
/api/itinerary POST AI provider vars, LINGO_DEV_API_KEY Generates a day-by-day trip itinerary
/api/cultural-intelligence POST AI provider vars, LINGO_DEV_API_KEY Returns cultural tips and etiquette
/api/nearby-places GET None Fetches nearby POIs from OpenStreetMap Overpass API
/api/chat POST AI provider vars Multi-turn AI travel assistant chat
/api/food-explorer POST AI provider vars Generates iconic local dishes with ordering phrases
/api/survival-card POST AI provider vars Generates a per-country survival card with emergency info
/api/speech/transcribe POST OPENAI_API_KEY or GROQ_API_KEY Transcribes audio to text (STT)
/api/speech/tts POST OPENAI_API_KEY Converts text to MP3 audio (TTS)

Deploy on Vercel

See DEPLOYMENT.md for the full deployment guide including:

  • Step-by-step Vercel setup
  • All environment variables
  • Vercel plan requirements (Hobby vs Pro)
  • Self-hosting with Docker
  • Troubleshooting

Quick deploy:

Deploy with Vercel


Supported Languages

English Japanese Chinese (Simplified)
Spanish French German
Italian Portuguese Arabic
Hindi Korean Russian
Turkish Thai Vietnamese

Contributing

Contributions are welcome. See CONTRIBUTING.md for guidelines.


License

MIT


Developed with love by Chetan Agarwal  ·  GitHub Repository

About

Atlasia gives travelers real-time AI translations, cultural intelligence, trip itineraries, an interactive world map, and emergency contact lookup.

Resources

Contributing

Stars

Watchers

Forks

Contributors