PhotoMapper
A geolocation photo-sharing app built with Next.js 16, React, and MapLibre GL. Upload a photo and the app automatically extracts GPS coordinates from the image’s EXIF metadata, then pins it to an interactive map. Photos are browsable both on the map and in a scrollable feed — think Instagram meets Google Maps.
Built with Supabase for auth and storage, Redux Toolkit and RTK Query for state management, and a Vitest + MSW test suite. The app degrades gracefully to mock data when Supabase is not configured, keeping local development frictionless.
Tech Stack
Frontend
Map-first UI built with MapLibre GL, driven by Redux Toolkit for global state and RTK Query for server data caching.
Backend & Auth
Serverless API routes handle uploads and queries. Supabase provides auth, Postgres, and object storage with RLS policies enforcing ownership.
Image Processing
EXIF metadata extraction pulls GPS coordinates automatically from uploaded photos. Canvas API resizes images client-side before upload.
Testing
Comprehensive test suite with Vitest, React Testing Library, and MSW for API mocking.