I recently developed a project that simulates the classic game of Rock, Paper, Scissors, but with a twist. Instead of two players, entities (rock, paper, and scissors) are automatically generated and moved randomly within an arena until only one type remains. Here's the repository: https://github.com/alejandrosnk/Cachipun-Automatic.
To make it even more engaging, I added a betting system where users can place virtual bets on the eventual winner. The system uses localStorage to retain points between sessions, providing a game-like experience and demonstrating basic web development concepts.
🔑 What this project demonstrates
- DOM Manipulation: Dynamically managing entity creation, movement, and deletion.
- Collision Detection: Enforcing Rock, Paper, Scissors rules when entities collide.
-
Persistence: Use of
localStorageto manage points and bets. - Simulation flow: From initialization → movement → battles → winner determination. - User interaction: Betting controls, speed settings, and modal dialogs.
🛠️ Tech stack
- HTML5 for the structure
- CSS3 for layout and animations
- Basic JavaScript for logic, events, and the simulation loop
🚀 How to run it
- Clone the repository.
- Open
index.htmlin your browser. - Start the simulation, adjust the speed, and place your bets.
⚡ Future Improvements
- Add simulation history
- More advanced entity movement
- Multiplayer betting system
- Backend integration for user profiles
👉 This project was a fun way to reinforce concepts of JavaScript animations, game logic, and client-side persistence.
💬 I'd love community feedback on how to take this further. What feature would you add next?
Top comments (0)