Building "Where Am I?": A GeoGuessr Alternative for Mobile

MrAdex77 — Wed, 08 Jan 2025 18:34:46 +0000

Hi Dev Community! 👋

I’m thrilled to share with you the journey of building Where Am I?, a mobile app designed as a free alternative to GeoGuessr and CityGuessr. It’s a location-guessing game that immerses players in street walk videos from around the globe. As a solo developer, this project has been a labor of love, and I wanted to give you a behind-the-scenes look at how it all came together from a tech perspective.

The Idea

The inspiration for Where Am I? started during the COVID-19 pandemic. With everyone stuck indoors, I wanted to create a game that offered a sense of exploration and adventure. Initially, the app was a simple prototype with basic features. It gained traction with over 50,000 downloads and amazing user feedback. Encouraged by the positive response, I decided to rewrite the app from scratch, making it more robust, feature-rich, and scalable.

Tech Stack

To bring this project to life, I chose the following technologies:

Frontend: React Native

Where Am I? is a cross-platform mobile app built with React Native. This allowed me to deliver a seamless experience for both Android and iOS users using a single codebase. The frontend was developed with a combination of JavaScript and TypeScript to ensure type safety and scalability.

Key libraries and tools:

Expo: Simplified the development process and provided access to native APIs.
React Navigation: For smooth navigation between screens.
Reanimated: For fluid animations and transitions.
Redux: To manage the global state, including user progress, leaderboards, and campaign data.

Backend: NestJS (Node.js Framework)

The backend is powered by NestJS, a progressive Node.js framework built with TypeScript. NestJS provided a modular structure, making the backend easier to maintain and scale.

Backend highlights:

RESTful APIs: Exposed endpoints for user authentication, leaderboard management, and campaign data.
PostgreSQL: The relational database for storing user data, scores, and game content.
Redis: For caching frequently accessed data like leaderboards.
JWT Authentication: Secured user sessions with JSON Web Tokens.

Cloud & Hosting

AWS (Amazon Web Services): Hosted the backend and database for scalability and reliability.
Cloudflare: Handled CDN and DDoS protection to ensure fast and secure gameplay.

Key Features

Immersive Gameplay: Watch high-quality street walk videos and guess the location.
Campaigns: Explore themed challenges like "Southern Europe's Sunlit Secrets" or "Unlock the UK's Royal Secrets."
Multiplayer Modes: Compete with friends in duels or join global tournaments.
Leaderboards: Track your progress and aim to become the "King/Queen of the World."
Collectibles: Earn badges and unlock monuments as you play.

Challenges & Lessons Learned

Cross-Platform Compatibility: React Native made cross-platform development easier, but handling platform-specific quirks required extra attention.
Video Optimization: Ensuring smooth playback of street walk videos on both high-end and low-end devices was challenging. I used adaptive bitrate streaming to address this.
Scalability: With an ever-growing user base, designing a backend that scales while maintaining fast response times was crucial. Redis caching was a game-changer here.
Localization: Adding support for languages like Spanish (ES) and Portuguese (PT) helped make the app accessible to a broader audience.

Why "Where Am I?" Stands Out

While GeoGuessr and CityGuessr are fantastic games, Where Am I? offers a unique twist:

Completely Free: No paywalls or subscriptions.
Mobile-First: Designed specifically for Android and iOS devices.
Immersive Campaigns: Themed challenges that take players on curated adventures.
Community-Centric: Player feedback drives new updates and features.

What’s Next?

The journey doesn’t stop here! I’m actively working on:

Custom Multiplayer Modes: Letting players create their own rules and challenges.
New Campaigns: Expanding the game with more countries and themes.
Augmented Reality (AR): Exploring ways to integrate AR for an even more immersive experience.

Try It Out!

If you’re looking for a fun, educational, and free GeoGuessr alternative, give Where Am I? a try. I’d love to hear your feedback and ideas for future updates.

Website: whereamigame.app
Google Play: Download on Android
App Store: Download on iOS

Thank you for reading! If you have any questions about the tech stack or the development process, feel free to drop them in the comments below. 🙌

DEV Community: MrAdex77