geohub: A TypeScript repository from Jadenjvl

Website • Discord • Donate

GeoHub is a free and open source geography guessing game inspired by Geoguessr.

For those unfamilar with Geoguessr, it uses Google Streetview to place you in a random location and you have to guess where you think you are in the world. You can move around and use clues around you such as Language, Architecture, Road Signs, etc... to make your guess. The objective is clear, the closer you are to the correct location, the more points you get.

💜 How can I support?

Even though you don't need to pay to play GeoHub, the game still costs money to run and relies on community support to stay running while it grows. If you enjoy playing, please support by donating as all donations will go towards paying for more Google Maps API credits + server costs.

If you still want to help support GeoHub but aren't able to donate, you can also create your own Google Maps API key which gives you $200 USD worth of credit every month. Unless you are playing 24/7 this will be more than enough credits for a single person, meaning you won't have to pay. See the FAQ section for instructions on how to setup your own key.

🎉 How do I play?

Go to the website and create an account, it is free and takes 15 seconds. If you don't want to create your own account, you can login to the guest account using the credentials below:

Email: guest@geohub.com
Password: geohub

Once you have an account, you are ready to play! You can click play on any of the offical maps on the home page such as:

Or you can click on the Find Maps link on the sidebar to navigate between all the different supported country maps and community favorites!

If you get bored of playing the standard gamemodes, you can try out the other gamemodes available:

Want to play with friends? Create a challenge link by following the steps below:

Choose a map you want to play
Click Play Now to open up the settings view
Instead of Single Player select Challenge
Choose the game play settings you want to enforce for the challenge
Click start and copy the challenge link
Share this link with friends and see how you compare

Tired of having the locations picked for you? Create your own map by following the steps below:

Click on the My Maps link on the sidebar
Click the Create New Map button
Choose a name for your map, and optionally a description and map avatar
Click Next to setup your custom map
Once on the map editor page, you can start adding locations to your map
Click anywhere on the map to preview the streetview location
Once you have added all the locations you want, click on the Save Map button which will let you save and optionally publish your map

❓ FAQ

Why are the colors inverted on google maps?

This means the daily quota for the google maps API has been reached since the game is currently running on the Google Maps free tier. The daily quota resets at midnight Pacific Time (PT). If you want to play unlimited games without hitting the daily quota, see below for how to add/create your own Google Maps API key.

How do I add my own Google Maps API key?

Go to your profile page and click on the settings button on the far right (alternatively you can go to this URL: Settings).
You then simply paste your key into the Custom API Key field and click Save Changes. Now all you have to do is refresh the page and enojoy playing as much as you want!

How do I create my own Google Maps API key?

Follow the steps outlined in this PDF

Will it cost me money to create my own Google Maps API key?

Short answer: No, it is nearly impossible to exceed the $200 USD credit per month on your own. To put it into perspective, you would have to play atleast 100 games every day of the month to even come close to exceeding the free tier.
If you are still concerned about getting billed, you can monitor your current billing period usage at any time by going to the Billing page on your Google Cloud account.

💻 Steps to run locally

Clone this repository
Create a Google Maps billing account and save the API key
Create a MongoDB database and save the connection string and name of the database you create
Create random secrets for NextAuth & Cryptr. On Linux/Windows run the following command in a terminal openssl rand -base64 32
In the root of the app, create a .env file and add the values below (replacing with your created credentials)

NEXT_PUBLIC_GOOGLE_API_KEY="your-google-maps-key"
MONGO_URI="your-mongodb-connection-string"
DB_NAME="your-mongodb-database-name"
NEXTAUTH_SECRET="any-random-string"
CRYPTR_SECRET="any-random-string"
NEXTAUTH_URL="http://localhost:3000"

Next, you can install the required dependencies and start the local dev server: