Skip to content
A game of for guessing which city it is, based on a selection of photos
JavaScript CSS HTML
Branch: master
Clone or download
Pull request Compare This branch is 53 commits ahead, 1 commit behind constructorlabs:master.
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
.vscode
assets
src
tests
.gitignore
Procfile
README.md
jest.config.js
package-lock.json
package.json
webpack.config.js

README.md

Screenshot

Which City?

Quiz game app

To play the Which City? quiz game simply choose a country, browse the photos and try to guess which city it is. It is designed for mobile view and offers a user-friendly experience.

View the live demo

View the repo on Github

Installation and set up

  • Clone this repo
  • Run npm install to install dependencies
  • Run npm run dev to create a development build with webpack
  • Open index.html file in the browser

Functionality and features

  • The game begins with the user selecting a country
  • A city of the selected country is chosen randomly
  • The app fetches 10 relevant photos for that city from the Unsplash photos API
  • Filtering functions ensure that the photos are relevant to the city
  • The app then uses React and SCSS to display the photos
  • The user then tries to guess the city by going through the photos
  • For each photo that is seen one life is lost
  • When the user finally makes a choice the result and score are displayed
  • If the answer is correct the user can enter their name into the top scores table using localStorage

Technology used

  • React
  • Classnames
  • BEM
  • Flex-box
  • SCSS
  • Unsplash API
  • Webpack

Stages of development

  • Set up API and read the Unsplash API documentation

Desired features with more time

  • Implement the ipad and desktop view for better responsiveness
  • Run some unit testing
You can’t perform that action at this time.