prathamesh424/Monad-Arcade

โ˜… 1Forks 1TypeScriptGitHub โ†—Compare

README

github-submission-banner

โšก Monad Arcade

Provably fair, on-chain casual games built for the speed and scale of Monad.


๐Ÿ“Œ Problem Statement

PS 2: Unleash blockchain gameplay with Monad

The challenge of creating user-friendly, performant, and truly decentralized applications that leverage the unique capabilities of blockchain technology, specifically within the high-throughput environment of Monad. A sub-problem addressed is the lack of transparent and verifiable random outcomes in traditional online gaming.


๐ŸŽฏ Objective

Monad Arcade aims to solve the problem of centralized and opaque online gaming by providing a suite of simple, provably fair casual games running directly on the Monad blockchain. It serves blockchain enthusiasts and casual gamers seeking a trustless gaming experience where game logic, randomness, and payouts are verifiable on-chain. The real-world value lies in demonstrating that blockchain, particularly a high-performance chain like Monad, can host interactive, engaging applications with built-in transparency and security for users' assets.


๐Ÿง  Team & Approach

Team Name:

[ Crypto Whales]

Your Approach:

  • We chose this problem to demonstrate the practical application of smart contracts and blockchain technology for interactive, user-facing products beyond just finance or collectibles. Casual games provide a great use case for showcasing transparent logic and direct value transfer.
  • Key challenges addressed included implementing game logic fairly and efficiently within Solidity, handling on-chain randomness securely (or simulating for demonstration), and building a responsive frontend that interacts seamlessly with the blockchain using wagmi and monitors real-time events for instant UI updates.
  • During hacking, a significant breakthrough was successfully integrating multiple distinct game types into a single contract and frontend structure, proving the scalability of the dApp architecture on Monad. Adapting client-side UI states (like animations and loading) to reliably follow on-chain transaction and event lifecycles was also a key focus.

๐Ÿ› ๏ธ Tech Stack

Core Technologies Used:

  • Frontend: Next.js, React, TypeScript, Tailwind CSS, Shadcn UI
  • Smart Contract: Solidity, Hardhat/Foundry (for development/testing)
  • Database: Monad Blockchain
  • APIs: Standard RPC endpoints via wagmi
  • Hosting: Vercel/Netlify (for frontend), Monad Blockchain (for contract)

Sponsor Technologies Used (if any):

  • Groq: [Explain if used, e.g., for AI-driven game hints, player analytics, etc.]
  • โœ… Monad: Our core blockchain implementation. We built and deployed our smart contract on the Monad Testnet, leveraging its EVM compatibility and experiencing its performance for transaction processing and event propagation.
  • Fluvio: [Explain if used, e.g., for real-time stream processing related to game events]
  • Base: [Explain if used, e.g., Smart Wallet integration for easier user onboarding]
  • Screenpipe: [Explain if used, e.g., for analyzing user interaction patterns]
  • Stellar: [Explain if used, e.g., for handling game payouts or cross-chain elements] (Mark with โœ… if completed, [x] for used)

โœจ Key Features

Highlight the most important features of your project:

  • โœ… Multi-Game Arcade: A single dApp featuring multiple distinct casual games (Dice, Coin Flip, Jackpot, Lightning Race, Crypto Slots).
  • โœ… On-Chain Betting & Payouts: Players place bets and receive winnings directly via smart contract interactions.
  • โœ… Provably Fair Outcomes: Game results are determined by logic within the Solidity contract. (Note: For true decentralization, integrates with a Verifiable Random Function like Chainlink VRF - Our current implementation uses owner-triggered randomness for demonstration, but can be upgraded).
  • โœ… Real-time Updates: UI reacts to on-chain events (wagmi event listeners) to show game results and history instantly.
  • โœ… Wallet Integration: Seamless connection with web3 wallets (like MetaMask) for transactions via wagmi.
  • โœ… Transparent Game History: Records of bets and outcomes stored immutably on the blockchain and displayed in the UI.

Add images, GIFs, or screenshots if helpful! (Add screenshots/GIFs of each game)


๐Ÿ“ฝ๏ธ Demo & Deliverables


โœ… Tasks & Bonus Checklist

  • โœ… All members of the team completed the mandatory task - Followed at least 2 of our social channels and filled the form (Details in Participant Manual)
  • โœ… All members of the team completed Bonus Task 1 - Sharing of Badges and filled the form (2 points)ย  (Details in Participant Manual)
  • โœ… All members of the team completed Bonus Task 2 - Signing up for Sprint.dev and filled the form (3 points)ย  (Details in Participant Manual)

๐Ÿงช How to Run the Project

Requirements:

  • Node.js (v18 or higher recommended)
  • pnpm (or npm/yarn)
  • A web3 wallet (e.g., MetaMask) connected to the Monad Testnet.
  • Testnet MON tokens in your wallet.
  • A deployed MonadArcade smart contract address and its ABI.

Local Setup:

  1. Clone the repo:

    git clone [https://github.com/your-team/monad-arcade.git](https://github.com/your-team/monad-arcade.git)
    cd monad-arcade
  2. Install dependencies:

    pnpm install
    # or npm install
    # or yarn install
  3. Setup Environment Variables: Added my Monad Testnet RPC URL and the deployed contract address and ABI.

  4. Start development server:

    pnpm run dev
    # or npm run dev
    # or yarn dev
  5. Open your browser and navigate to http://localhost:3000.

Remember that for the Lightning Race and Slots games (in their current owner-triggered randomness implementation), the contract owner (you) will need to call the respective resolve functions (resolveLightningRace, _resolveSlotsGame - note the underscore if it's internal) on the deployed contract after a player places a bet for the game outcome to be finalized on-chain and the event emitted.


๐Ÿงฌ Future Scope

  • ๐Ÿ“ˆ Integrate Chainlink VRF or another decentralized randomness solution for truly trustless outcomes in all games.
  • ๐Ÿ›ก๏ธ Implement comprehensive input validation and error handling in both smart contract and frontend.
  • ๐ŸŒ Improve UI/UX, add animations, sound effects, and mobile responsiveness.
  • ๐Ÿ‘ค Implement user profiles and persistent game statistics (win/loss streaks, total wagered/won).
  • ๐Ÿ”ฅ Optimize smart contract for gas efficiency.
  • ๐Ÿ“Š Add a global leaderboard fetched from on-chain data or indexed events.
  • โš™๏ธ Explore adding more game types.

๐Ÿ“Ž Resources / Credits

  • wagmi (React Hooks for Ethereum)
  • viem (TypeScript library for EVM)
  • Next.js (React Framework)
  • Tailwind CSS (CSS Framework)
  • Shadcn UI (Reusable UI components)
  • Lucide React (Icon library)
  • Solidity (Smart Contract Language)
  • Hardhat / Foundry (Smart Contract Development Environment)
  • Monad Documentation
  • Etherscan/Monadscan (for verifying transactions and contract interaction)

๐Ÿ Final Words

Building on Monad has been an exciting experience! Navigating the integration of smart contract logic with a dynamic frontend, managing transaction states, and leveraging on-chain events presented unique challenges and rewarding breakthroughs. We're proud to contribute this early dApp to the Monad ecosystem and look forward to seeing more innovative applications built on this high-performance chain.

Contributors

prathamesh424sanketshinde3001

Issues