DevLog: Triple Triad with React

I've been wanting to build this as an exercise for the longest time. Triple Triad is a mini card game I played a lot in Final Fantasy VIII. The basic rules are very straightforward, but the game has potentials to be more dynamic with mixing and matching of additional rules.

Basic rules:

  • Each player, either red or blue, starts with five cards of their respective color in hand.
  • Each player's score is counted by the total cards in their color -- on the board and in their hand.
  • Players take turns playing a card on the board. To gain score and make your opponent lose score, your card must turn over your opponent's to your color by playing a higher consecutive number to its neighbor of the opposite color.
  • The game ends when the 3x3 board is filled with 9 cards.
  • The player with the most cards in the color wins. A draw when both players have the same score.

Dev vomit throughout process: Triple Triad DevLog on Google Docs

April 14, 2024 Update

Still WIP. What I got done:

  • Card flipping logic
  • Focus
  • Turn toggling

Triple Triad Card Game

Todo for next update(s):

  • Score
  • Win conditions and reset game
  • More cards (dealt randomly for now)
  • Clean up READMEs (they're more like notes and rambling atm lol)