Inspiration

When someone asks what to do in Vancouver, the answers usually default to the headline attractions. Great spots, but they leave out the smaller discoveries that make a city feel personal: a tucked-away viewpoint, a quiet pond, a mural on a side street, a pop-up event you only notice by walking past. We wanted a way for both tourists and locals to surface those moments and make exploring feel more like a shared story than a checklist.

What it does

Local Gems is a map-based feed of photos and notes pinned to specific places. Users explore gems within a chosen radius, open pins to see what was shared, appraise favorites, and post their own gem at their current location. The result is a lightweight way to discover new corners of a city and leave something behind for the next person.

How we built it

We built Local Gems as a web app with an interactive map UI using React, Next.js, and Leaflet. Posts are stored in MongoDB, including coordinates, images, and engagement counts. The app fetches gems near the user’s location based on their selected range, updates periodically, and renders markers and popups directly on the map. Users can also view their own profile and other users to see what posts they have.

Challenges we ran into

  • Photo capture saving to MongoDB.
  • Geolocational access for accurate map interface.
  • Internal tech framework efficiencies.

Accomplishments that we're proud of

  • User intuitive interface/experience.
  • User profile tracking.
  • User authentication using better-auth.

What we learned

  • MongoDB aggregation integration.
  • Full stack development.
  • Collaboration between a team of first time hackers.

What's next for Local Gems

  • Integration with other OAuth providers.
  • Friend system to see where your friends have been.
  • Allowing users to comment on gems.
  • Push notification system for activity alerts.

Built With

Share this project:

Updates