Welcome to the Rock Paper Scissors GitHub project! This repository contains the code for a simple implementation of the classic game "Rock Paper Scissors". It provides a retro game user interface (UI) for players to interact with and play the game.
The project aims to provide a user-friendly version of the popular game "Rock Paper Scissors". The game follows the traditional rules: the user select either rock, paper, or scissors, and the computer randomnly select its choice. The round winner, awarded with +1 point, is determined based on the game's rules: rock beats scissors, scissors beats paper, and paper beats rock. First to score 5 points wins the game.
The project is implemented in Vanilla JavaScript.
- Play Rock Paper Scissors against the computer.
- User-friendly interface with buttons for player input.
- Real-time updates of the game result and score.
- Option to reset the game and start over.
The repository hase the following structure:
img/
: Directory that holds the image assets used in the user interface.index.html
: The main HTML file that contains the user interface and game logic.script.js
: The JavaScript file that handles the game functionality.style.css
: The CSS file that styles the user interface.README.md
: The README file that provides an overview of the project and instructions for running the game.
You can play the live version of the game here.
To run this project locally, follow these steps:
-
Clone the repository:
git clone https://github.com/sofiabaezzato/rock-paper-scissors.git
-
Navigate to the project directory:
cd rock-paper-scissors
- Open the
index.html
file in your preferred web browser. - Select either "Rock," "Paper," or "Scissors" by clicking on the corresponding button.
- The computer will randomly select its move.
- The result of the round will be displayed, along with the updated scores.
- To start a new game, click on the "Reset" button.
- This is the first project I completed entirely from scratch, without any assistance or guidance.
- This project has allowed me to gain more confidence in JavaScript, specifically in DOM manipulation using the addEventListener() method and getElementById() method.
- Other important concepts that I have learned to use, hopefully correctly, are variables, scope, and hoisting.
- Even though I had a clear vision of the entire project from the beginning, translating that into clean code proved to be extremely challenging. In the end, the code functions as intended, but I acknowledge that it may appear messy and the logic could be simplified. I hope to improve my skills in writing cleaner and more concise code in the future.
- In the end, I added a function that displays random sentences of victory or defeat. I thought it would be a nice touch to conclude this awesome project.