WNDR

Your personal visual diary. Your memories mapped across the world.

Comment

Inspiration

My inspiration came from trying to find an incentive to bring people back outside. Giving people a reason to visit places. We all bookmark those places on Instagram, but we never go out to visit them. WNDR makes sure the plans make it out the group chat. After it makes it out the group chat, it would be nice to be able to go back on it and revisit those memories.

What it does

WNDR is a memory mapping app that lets you pin experiences to real-world locations using an interactive map. Users can:

Add photos, titles, moods, and notes to memories

Choose between GPS or manual location selection

Enjoy smart clustering of memories (like Apple Photos)

Use optional AI to auto-generate descriptions and mood tags

View memories via map, timeline, or gallery

Securely sign in with email and auto-generated profiles

How we built it

Frontend: React 18 + TypeScript, Vite, Tailwind CSS, Framer Motion, Google Maps API

Backend: Supabase for authentication, real-time sync, secure PostgreSQL, and storage

We started with Node.js/Express but moved to Supabase for speed, security, and scalability.

Challenges we ran into

Authentication Evolution: Initially implemented phone-based authentication with Twilio, but encountered A2P messaging restrictions on trial accounts. This led to migrating to email authentication, which proved more reliable and accessible for users worldwide.

Backend Migration: Started with a traditional Node.js/Express backend but faced deployment complexities on platforms like Railway and Render. The solution was migrating to Supabase BaaS, eliminating server management while providing enterprise-grade security and performance. Real-time Data Management: Handling authentication state and preventing endless loading loops required implementing non-blocking user profile creation and proper session management with automatic token refresh.

Accomplishments that we're proud of

  • Created an intuitive interface with real-time password validation, smooth animations, memory clustering, and responsive design that works beautifully across all devices.
    • Utilized TypeScript throughout for type safety, implemented proper CI/CD with automatic deployments, and followed best practices for scalable React architecture.

What we learned

Backend-as-a-Service Power: Discovered how Supabase BaaS can dramatically simplify development while providing enterprise-grade features like real-time subscriptions, automatic scaling, and robust security. Learned the importance of choosing accessible authentication methods and implementing proper session management with non-blocking profile creation. Gained experience with React 18, TypeScript, and modern state management patterns, particularly around authentication contexts and real-time data handling.

What's next for WNDR

  • Migrating to Mobile:
    • Native iOS and Android apps with offline capability
    • Camera integration for instant memory creation Social Features:
    • Memory sharing with friends and family
    • Collaborative memory creation for shared experiences
    • Public memory galleries for travel inspiration Local Partnerships: Collaborate with museums, restaurants, and local businesses to offer location-based perks — like 50% off tickets for visiting during specific times, snapping a photo at a certain spot, or discovering hidden “easter eggs” tied to memories on the map.

Built With

Share this project:

Updates