Door2Destination is a mobile travel companion application built for TamuHack 2026. The app helps travelers manage their entire journey from booking rides to navigating airports, tracking flights, and preparing for security checkpoints. It combines flight management, interactive airport maps, rideshare integration, and voice-guided navigation into a single mobile experience.
The app serves as a companion experience for American Airlines travelers, though it's designed to work independently. Users can add flights, view their itinerary, navigate airport terminals using interactive maps, book rides to and from the airport, and use voice-guided directions for hands-free navigation. The interface supports multiple languages and includes accessibility features for a broader user base.
Flight Management Add and track upcoming flights with terminal, gate, and seat information. The home screen displays a timeline view of your journey with estimated times for each step from leaving home to baggage claim.
Interactive Airport Maps Full-screen, zoomable maps of Dallas Fort Worth International Airport showing terminal boundaries, gate locations, and amenities like restaurants and restrooms. Map data is cached locally for offline access.
Rideshare Integration Book rides directly from the app. Enter pickup and dropoff addresses, select ride types, and track ride status. Uses Uber's sandbox API for demonstration purposes.
Voice Navigation Hands-free navigation mode with text-to-speech turn-by-turn directions. Useful when walking through terminals with luggage. Supports multiple languages.
TSA Checklist Interactive pre-flight checklist based on TSA guidelines, organized by category. Progress is saved and persists across app sessions.
Baggage Tracking Demo interface for scanning and tracking baggage. Includes camera integration for scanning baggage tags.
Multilingual Support Full UI translation support for English, Spanish, French, German, and Japanese. Language selection persists across sessions.
Zen Mode Distraction-free navigation mode that focuses solely on wayfinding without other UI elements.
The frontend is built with React Native and Expo, using TypeScript throughout for type safety. Expo Router handles file-based navigation, and React Native Maps provides the interactive map functionality. Authentication is handled by Clerk, with tokens stored securely using Expo SecureStore. Local data persistence uses AsyncStorage.
The backend is a Python FastAPI application that acts as a proxy for external APIs, handling geocoding requests and rideshare API calls. It runs with Uvicorn and includes CORS configuration for cross-origin requests from the mobile app.
For development, we use Expo Go for testing on physical devices, Metro as the bundler, and Babel for JavaScript transpilation.
The frontend follows a layered architecture with clear separation between UI components, business logic, and data storage. Screen components live in the ui/ directory, reusable components in components/, and service logic in services/. A type-safe service layer in src/ handles API clients, storage abstractions, and feature-specific logic.
Authentication flows through Clerk, with tokens cached in SecureStore. Flight data is stored locally using AsyncStorage, allowing the app to work offline for viewing saved flights. Airport map data is fetched from OpenStreetMap via Overpass API and cached locally for performance.
The backend provides REST endpoints for geocoding and rideshare operations. It handles rate limiting and error handling for external API calls, acting as a proxy to avoid exposing API keys in the client bundle.
flowchart TB
subgraph Mobile["Mobile App (React Native/Expo)"]
direction TB
UI["UI Layer<br/>(Screens)"]
Components["Components<br/>(Reusable)"]
Services["Services<br/>(Business Logic)"]
UI --> Components
Components --> Services
Services --> ServiceLayer
Services --> LocalStorage
end
subgraph ServiceLayer["Type-Safe Service Layer (src/)"]
direction LR
APIClients["API Clients"]
StorageAbstraction["Storage Abstractions"]
Features["Feature Modules"]
end
subgraph LocalStorage["Local Storage"]
direction TB
AsyncStorage["AsyncStorage<br/>(Flight Data, Maps)"]
SecureStore["SecureStore<br/>(Auth Tokens)"]
end
subgraph Backend["Backend API (Python FastAPI)"]
direction TB
GeocodeProxy["Geocoding Proxy"]
RideshareProxy["Rideshare Proxy"]
RateLimit["Rate Limiting<br/>& Error Handling"]
GeocodeProxy --> RateLimit
RideshareProxy --> RateLimit
end
subgraph External["External Services"]
direction TB
Nominatim["Nominatim<br/>Geocoding"]
Uber["Uber Sandbox API"]
OSM["OpenStreetMap<br/>Overpass API"]
Clerk["Clerk<br/>Authentication"]
ElevenLabs["ElevenLabs<br/>Text-to-Speech"]
end
ServiceLayer -->|HTTPS/REST| Backend
ServiceLayer -->|Direct API Calls| ElevenLabs
ServiceLayer -->|Direct API Calls| Clerk
ServiceLayer -->|Direct API Calls| OSM
Backend -->|Proxy Requests| Nominatim
Backend -->|Proxy Requests| Uber
Clerk -->|Auth Tokens| SecureStore
OSM -->|Map Data Cache| AsyncStorage
style Mobile fill:#e1f5ff
style Backend fill:#fff4e1
style External fill:#f0f0f0
style LocalStorage fill:#e8f5e9
style ServiceLayer fill:#f3e5f5
Prerequisites
- Node.js (v18 or later)
- Python 3.8 or later
- Expo Go app installed on your device, or iOS Simulator/Android Emulator
- npm or yarn
Installation
Clone the repository and install dependencies:
git clone <repository-url>
cd door2destination
npm installFor backend features (rideshare and geocoding), set up the Python environment:
cd backend
python -m venv venv
# On Windows
venv\Scripts\activate
# On macOS/Linux
source venv/bin/activate
pip install -r requirements.txtCreate a .env file in the root directory for any optional API keys or configuration. The app works in demo mode without additional configuration, though some features may be limited.
Start the backend server in one terminal:
cd backend
uvicorn main:app --reload --host 0.0.0.0 --port 8000Start the Expo development server in another terminal:
npm startOpen Expo Go on your device and scan the QR code, or press i for iOS Simulator, a for Android Emulator, or w for web browser.
door2destination/
├── app/ # Expo Router routes
│ ├── _layout.tsx # Root layout
│ ├── tsaScan.tsx # Baggage scan screen
│ └── tsaScanResult.tsx # Scan results
├── assets/ # Static assets
│ ├── data/ # JSON data files
│ └── images/ # Image assets
├── backend/ # Python FastAPI backend
│ ├── main.py # API server
│ ├── uber.py # Uber integration
│ ├── geocode.py # Geocoding proxy
│ └── requirements.txt # Python dependencies
├── components/ # Reusable React components
├── config/ # App configuration
├── data/ # TypeScript data definitions
├── services/ # Frontend service layer
├── src/ # Type-safe source code
│ ├── config/ # Configuration utilities
│ ├── features/ # Feature modules
│ ├── services/ # API clients
│ ├── storage/ # Storage abstractions
│ ├── types/ # TypeScript type definitions
│ └── utils/ # Utility functions
├── ui/ # Screen components
├── App.tsx # Main app entry point
├── app.config.js # Expo configuration
└── package.json # Node.js dependencies
This project demonstrates several engineering competencies relevant to mobile development:
Mobile Development Cross-platform React Native development using Expo, with file-based routing and native module integration for maps, camera, and audio. The UI is designed with accessibility in mind, including support for screen readers and reduced motion preferences.
State Management and Data Persistence Local storage architecture using AsyncStorage for offline-first functionality. Secure token storage with Expo SecureStore. Type-safe data models throughout using TypeScript.
API Integration RESTful API design with FastAPI backend. Integration with third-party services including rideshare APIs and geocoding services. Error handling and retry logic for network requests. CORS configuration for cross-origin requests.
Performance Optimization Airport map data caching for offline access. Lazy loading of map components. Efficient re-rendering patterns using React hooks.
User Experience Multilingual support with a translation system. Voice-guided navigation for hands-free use. Accessibility features including screen reader support and reduced motion. Intuitive navigation patterns with sidebar and bottom tab navigation.
Architecture Patterns Separation of concerns with distinct UI, service, and storage layers. Service abstraction for API clients. Type-safe interfaces throughout the codebase. Modular component design for reusability.
This is a hackathon demo project with several limitations:
Demo-Only Features The Uber integration uses sandbox APIs, so no real rides are booked. Flight data is stored locally only—there's no real-time flight status API integration. Some demo data like gate numbers and addresses are hardcoded for demonstration purposes.
Known Limitations Currently supports DFW Airport only, though the map data structure is designed to support additional airports. Flight data is stored locally and doesn't sync across devices. Airport maps are cached for offline access, but other features require network connectivity.
Production Readiness This project is not production-ready. A production version would need backend proxies for sensitive API keys, real flight data API integration, user data persistence on a backend server, error monitoring and logging, performance optimization for larger datasets, and a security audit of authentication flows.
Potential improvements include support for additional airports, real-time flight status API integration, backend database for user data persistence, push notifications for flight updates, social features for sharing trips, advanced voice commands with natural language processing, AR wayfinding for terminal navigation, and integration with airline loyalty programs.
Devpost Submission - View our hackathon project submission
Thanks to American Airlines for inspiration on the companion app experience, OpenStreetMap for airport map data, and the various service providers whose APIs we integrated for this project.