🔗 Live preview:
This was an introduction to the backend using firebase project for The Odin Project's JavaScript curriculum. The goal of the project is to create a 'Wheres Waldo' type of game that incorporates a backend. Players select a level and must find 3 hidden characters. The characters coordinates are used to identify their location in the level, selecting the correct coordinates (along with the character) will mark a character as found. Firebase is used as a backend to store the game data & highscores for each level. This project as made with the React JS Library, TailwindCSS, and Firebase.
- Global Leaderboard for 3 unique levels that updates in realtime.
- Use of firebase-firestore for a live back end database.
- Responsive Design.
- HTML
- TailwindCSS
- JS
- React
- React Router - Router tool for React applications
- Visual Studio Code - IDE
- Npm - Package Manager
- Webpack - Code bundler
- Firebase's Firestore - Scalable, flexible NoSQL database for web, mobile and server development.
- ESLint - A linter tool to standardize code
- Prettier - Code formatter
- Github Pages - Hosting
- GH-Pages Deployment
- Interact with a NoSQL flexible database.
- Design an application with a clean user interface.
- Understand and integrate a Backend-as-a-Service (BaaS) provider in Firebase into the app.
- Familiarize with Firebase's services, in particular Cloud Firestore.
- Further improve React proficiency in functional components using Hooks.
The illustration(s) is authored by the amazing artist Egor Klyuchnyk.
You can buy the art as a poster from Anomaly World.
As on any project, there are always more things that I would like to implement that didn't make it to the final version you see live. This section lists a few of them for future me to pickup and add them.
- Add more characters.
- Add more levels.
👤 AminuMado
- GitHub: AminuMado