Code Monkey home page Code Monkey logo

project-guess-who's Introduction

Guess Who? ๐Ÿค”

In this project I've built the digital version of the old character guessing game called "Guess Who".

Most of the HTML structure and styling, as well as some functions in JavaScript, was already in place from the start so that I could focus more on the JavaScript part.

The problem

The main task was to build a guessing game using primarily JavaScript.

The first thing I did was to to think about the game "Guess Who" itself, i.e. the different parts and steps of the game. After that I proceeded to look at the starter code to get a feel for the structure of it and what needed to be done and in what order etc.

I then proceeded to build functions for the different steps of the game, which mainly consisted of setting a secret person, setting up an object for the user's selection (a property) in the drop down menu and then to compare this with the the secret person. Depending on the result of the comparison, a filtering method was applied to generate the board anew with the correct persons remaining. The user is also alerted with a message of the results of this filtering. This process continued until the user is ready to make a guess on the secret person, leading the game to end either on a win or a lose for the user depending on if the guess was correct or not.

For the abovementioned functions I generally used if statements and eventlisteners, but also the filter method. The main part to get the filter method to work was to have an object containing the user's selection in the drop down menu and then compare this property with the secret person's. When the JavaScript functionality was in place, I proceeded to style the webpage a bit with CSS and added a color theme that I liked.

I also wanted to try and write less code if possible, which I think I've accomplished quite well considering the level I'm currently at.

I'm happy about how the project turned out and that I got the basic requirements for the functionality in place. If I had more time, I would add a couple functionalities such as a timer that measures how long time each game takes, sound effects on different kinds of actions, a user input field for the user's name and a highscore board. Also I would've liked to change the characters completely to be about animals (either cats or dogs) and a styling to match!

View it live

To view the site I've created, check it here: https://amazing-mccarthy-a42098.netlify.app/

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.