https://github.com/kate8382/guess_number_game

A browser-based number guessing game with a timer, hints, and limited attempts. Includes both procedural and OOP (class-based) implementations—switchable via index.html. Useful for learning JavaScript browser events, execution context, and classes.
https://github.com/kate8382/guess_number_game

browser-events classes css education execution-context game hints html javascript oop self-study timer

Last synced: about 2 months ago
JSON representation

A browser-based number guessing game with a timer, hints, and limited attempts. Includes both procedural and OOP (class-based) implementations—switchable via index.html. Useful for learning JavaScript browser events, execution context, and classes.

• Host: GitHub
• URL: https://github.com/kate8382/guess_number_game
• Owner: kate8382
• License: mit
• Created: 2025-05-08T13:27:54.000Z (about 1 year ago)
• Default Branch: main
• Last Pushed: 2025-06-27T17:24:26.000Z (12 months ago)
• Last Synced: 2025-06-27T18:31:53.682Z (12 months ago)
• Topics: browser-events, classes, css, education, execution-context, game, hints, html, javascript, oop, self-study, timer
• Language: JavaScript
• Homepage: https://kate8382.github.io/guess_number_game/
• Size: 5.07 MB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

          
# Guess Number Game

## Description

This project is a practical assignment for self-study of the JavaScript "Advanced Level" course, focusing on a deeper understanding of the topics "Browser Events", "Execution Context", and "Classes". As part of this work, the file `class.js` was added.

This is a simple game where the user needs to guess the number chosen by the computer. The project is developed using HTML, CSS, and JavaScript.

## Screenshots

### Desktop Version (1024px)

![Desktop Version](./screenshots/image1.png)

### Adaptive Design (768px) with Info Alert

![Adaptive Design](./screenshots/image2.png)

### Victory Alert (560px)

![Victory Alert](./screenshots/image3.png)

### End of Game with Loss (560px)

![End of Game](./screenshots/image4.png)

## Refactoring Story

Read about the transition from procedural to OOP style and the main challenges I faced:

- [OOP vs Procedural: My Refactoring Story (Wiki version)](https://github.com/kate8382/guess_number_game/wiki/OOP%E2%80%90vs%E2%80%90Procedural)

- [OOP vs Procedural: My Refactoring Story (Markdown file)](./OOP-vs-Procedural.md)

## Access the Game

You can play the game online through GitHub Pages:

[Guess Number Game](https://kate8382.github.io/guess_number_game/)

## View the Code

You can view and clone the source code from the GitHub repository:

[View Source Code](https://github.com/kate8382/guess_number_game.git)

## Installation

1. Clone the repository:

   ```bash

   git clone https://github.com/yourusername/guess_number_game.git

   ```

2. Open the `index.html` file in your browser.

## Usage

- Follow the on-screen instructions to guess the number.

- Enjoy the game!

## License

This project is licensed under the MIT License. See the [LICENSE](./LICENSE) file for details.