A fun and interactive dice game built with React and Vite. The goal is to get all ten dice to show the same number in the fewest rolls possible.
This project is a web-based implementation of the Tenzies dice game. It was developed as a hands-on project to practice and solidify core React concepts, including state management with useState and useEffect, conditional rendering, component lifecycle, and handling user events. It also incorporates fun libraries like react-confetti for a rewarding user experience.
- The game starts with ten random dice.
- Click the "Roll" button to roll the dice.
- Click on any die to "freeze" it at its current value. Frozen dice will not change on the next roll.
- Keep rolling and freezing dice until all ten show the same number.
- Once you win, a confetti animation will celebrate your victory! Try to win in as few rolls as you can.
- Interactive Dice Rolling: Roll the dice with a single button click.
- Hold/Freeze Dice: Click on a die to hold its value for the next round.
- Win State Detection: The game automatically detects when you've won.
- Roll Counter: Tracks the number of rolls you've taken to win.
- Celebratory Confetti Effect: A fun animation using
react-confettiappears when you win. - Clean & Modern UI: A simple and intuitive interface for a pleasant gaming experience.
This project was built using modern web technologies:
- React.js
- Vite
- JavaScript (ES6+)
- CSS3
- HTML5
- nanoid for unique key generation
- react-confetti for the winning animation
To get a local copy up and running, follow these simple steps.
Make sure you have Node.js and npm installed on your machine.
- npm
npm install npm@latest -g
- Clone the repository:
git clone [https://github.com/VitorPio7/TenzieGame.git](https://github.com/VitorPio7/TenzieGame.git)
- Navigate to the project directory:
cd TenzieGame - Install the NPM packages:
npm install
To run the app in development mode, use the following command. This will open the app on http://localhost:5173 (or the next available port).
npm run devDistributed under the MIT License. See LICENSE for more information.
Vitor Pio - [GitHub Profile](https://github.com/VitorPio7
