Geo Explorer is an educational geography game designed to be both informative and engaging. Designed for desktop and mobile devices, it combines interactive learning with gamified quizzes, personal progress tracking, and global competition through a dynamic leaderboard — making geography fun and accessible for learners of all ages and skill levels.
👉 Live Site: Geo Explorer
📺 Meet the Team & Explore Geo Explorer!
This project's success is thanks to our amazing team, each contributing to the Geo Explorer web app. In this video, we'll introduce ourselves and give you a quick tour of the app's features and how it works.
Geo Explorer was built to make learning geography enjoyable for everyone, no matter your current knowledge level. Whether you're studying mountain ranges in Africa or identifying countries on a world map, the app adapts to your pace and encourages improvement through structured quizzes.
🌐 Cross-Platform Play
Enjoy a smooth, responsive experience on both mobile and desktop devices.
🔐 Guest & Account Login
Log in as a guest for a quick game, or create an account to track progress over time.
🧑🎨 Custom Avatars
Choose an avatar you like when creating an account — and change it anytime from your profile.
📊 Progress Tracking
Your achievements, quiz levels, and scores are saved so you can pick up right where you left off.
👤 Personalized Profiles
View your total score, track progress in Nature and Territory, and see how far you've come — all in one place.
🌙 Dark/Light Mode
Toggle between light and dark themes to suit your environment and reduce eye strain.
📚 Interactive Learning Cards
Select a continent or explore the world to study topics like:
-
- 🏔️ Mountain
- 💧 Water
- 🏞️ Landscape
- 🗺️ Country
- Flip the cards for key facts that help you ace the quizzes!
🧠 Structured 3-Stage Quizzes
Test your knowledge with a tiered quiz system filtered by continent or world:
-
- ✅ Multiple Choice
- 🔗 Matching Pairs (with color-coded selections)
- 🌍 Interactive Map Quiz
📈 Level Progression System
Begin at Beginner, unlock Intermediate, and advance to Expert by completing each stage.
🏆 Global Leaderboard
Compete with friends and other players around the world — climb the ranks and show off your top score!
If you're interested in exploring how the backend powers Geo Explorer, check out the following resources:
-
🔧 Backend Repository – Dive into the server-side logic, authentication, and data management.
👉 View Backend Repo -
📡 API Documentation – Explore available endpoints, request formats, and responses.
👉 View API Endpoints
To run this project locally, make sure you have the following installed:
-
Node.js
v18.0.0or higherCheck your version with:
node --version
-
npm
v9.0.0or higherCheck your version with:
npm --version
Follow these steps to run the project locally:
1. Clone the repository
git clone https://github.com/Group6-Route66/geo-explorer-fe.git2. Navigate into the project directory
cd geo-explorer-fe3. Install all dependencies
npm install4. Start the development server
npm run devThe app should now be running at: 👉 http://localhost:3000 by default
Created with ❤️ by Route 66 Team @ Northcoders
Team Members: Sofiia Madryha, Nayden Hristov, Wai Yan Sze, Mohammed Humadi, Catarina Sapateiro, Phone Sett Paing
Have fun exploring the world!
This group project was built as part of the Software Development Bootcamp in JavaScript course provided by Northcoders. It showcases our skills in frontend development, responsive design, state management, and collaborative teamwork using modern web technologies.