A classic dice game built while following Jonas Schmedtmann's The Complete JavaScript Course.
This is my third complete JavaScript project. Players take turns rolling a dice and can choose to "Hold" their current score or continue rolling. If a player rolls a 1, they lose their current points and the turn passes to the other player. First to reach 100 points wins!
- Turn-based gameplay with two players
- Roll dice and accumulate points
- Hold current score to bank points
- Win condition (first to 100 points)
- Clean UI with active player highlighting
- Reset game functionality
- Click sound feedback on button actions
- HTML5
- CSS3
- Vanilla JavaScript (DOM manipulation, event handling, game logic, sound)
The Pig Game is a simplified version of traditional dice games that date back centuries. The modern "Pig" dice game was popularized in the mid‑20th century as a quick, easy‑to‑learn family game. Its appeal lies in the balance between risk and reward: players must decide whether to keep rolling for more points or "hold" to secure their score, knowing that a single unlucky roll can wipe out their progress.
The game has been used in classrooms to teach probability and decision‑making, and it remains a staple in beginner programming courses because its rules are simple yet perfect for practicing loops, conditionals, and state management. By recreating Pig in JavaScript, learners get hands‑on experience with DOM manipulation, event‑driven programming, and building interactive web apps.
- Click Roll Dice to roll
- Click Hold to save your current points
- First player to reach 100 points wins!
- Rolling a 1 loses your current turn points
- DOM manipulation
- Event listeners
- Game state management
- JavaScript logic and refactoring
- Working with classes and dynamic UI updates
- Adding sound and visual feedback
Built as part of my self‑taught JavaScript journey in 2026.
📅 Last updated: 1 May 2026, 19:32 (WAT)
Feedback and suggestions are welcome!