Git Product home page Git Product logo

rps's Introduction

Rock, Paper, Scissors

Rock, Paper, Scissors is a designed to show that Javascript can be used to make a fun interactive game of chance. This site is aimed at those who want to play against the computer in a heads up game of chance.

Responsive Mockup

Features

  • The Rock, Paper, Scissors Heading

    • Featured at the top of the page, the heading is simply to outline the name of the game.
  • The Game Area

    • This section will allow the user to play the game. The user will be able to easily see buttons they can use to choose either rock, paper or scissors.

Game

  • The Scores section

    • The scores section is where the user can see who is winning in their game against the computer, this section updates as the player makes their seletion.
    • Once the use makes a choice, the computer does the same and then the image is updated accordingly, when a winner is determined the score updates. Question
  • The Results Area

    • This section shows the result of both choices and displays a message detailing if it was a win, loss or draw.

score

Testing

  • When testing this project I made sure to check on other devices, after deployment I used my iPhone 13 and it worked as expected. Other tests I did included the lighthouse test, on my first test you can see that I got a very low score on performance,Lighthousethis was because my images were sized incorrectly, I used Lint images to check the responsiveness of the images and as you can see here it outlines the issue,LintI then resized the images and as you can see it improved the score significantly. Performance

  • While testing I noticed that my style.css would not change for the computer-score div, after some time I noticed that I had placed the closing /div tag in the wrong line of code as you can see here,Incorrect-div once I placed it at the correct place then my styling worked as intended.

Validator Testing

  • HTML
    • No errors were returned when passing through the official W3C validator
  • CSS
  • JavaScript
    • No errors were found when passing through the official Jshint validator
      • The following metrics were returned:
      • There are 6 functions in this file.
      • Function with the largest signature take 2 arguments, while the median is 1.
      • Largest function has 8 statements in it, while the median is 3.
      • The most complex function has a cyclomatic complexity value of 3 while the median is 2.

Unfixed Bugs

There are no unfixed bugs.

Deployment

This section should describe the process you went through to deploy the project to a hosting platform (e.g. GitHub)

  • The site was deployed to GitHub pages. The steps to deploy are as follows:
    • In the GitHub repository, navigate to the Settings tab
    • From the source section drop-down menu, select the Master Branch
    • Once the master branch has been selected, the page will be automatically refreshed with a detailed ribbon display to indicate the successful deployment.

The live link can be found here - https://jakecun.github.io/RPS/

Credits

Media

rps's People

Contributors

jakecun avatar

Watchers

 avatar

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.