CyberHunter is a Where's Waldo (Photo Tagging) style of game where your goal is to find all the hidden characters. After finding all of them, you can submit your score on the leaderboard, sorted by fastest times.
- Interactive gameplay: Includes stopwatch timer to track your time and visual indicators for successful/failed character picks.
- Server-side checks: All the relevant procedures such as checking character location/hitbox or player score comparisons are handled server side.
- Responsive/Mobile friendly design: Smooth experience in small devices and landscape orientations. Character locations are handled with relative coordinates and includes overflow edge-cases.
$ git clone https://github.com/amit-amsl/wheres-waldo-frontend.git$ git clone git@github.com:amit-amsl/wheres-waldo-frontend.gitcd wheres-waldo-frontend
npm installnpm run devThe application will be available at http://localhost:5173 by default. Have fun!
- React: A JavaScript library for building user interfaces.
- Vite: Next generation frontend tooling.
- TypeScript: Typed superset of JavaScript.
- react-router-dom: A popular library used in React applications to manage routing and navigation within a single-page application (SPA).
- TailwindCSS: Utility-first CSS framework.
- DaisyUI: A popular Tailwind CSS plugin that offers a range of pre-made, editable UI elements
- Tanstack Query (aka React-Query): Powerful library designed to simplify data fetching and state management in web applications.
- Axios: A popular library used for making HTTP requests.
- Zustand: Small, fast, and scalable state management library for React applications
- react-hot-toast: lightweight, customizable, and accessible toast notification library for React applications.
- Lucide React: Icon library for React.
Feel free to fork the repository and submit pull requests. Any contributions, whether they’re bug fixes, new features, or performance improvements, are always welcome.