University Project / Software Engineering 2
Connect 4
A same-device two-player game with move history and locally stored highscores, expanded from an initial tic-tac-toe assignment into a more involved state-management problem.
The Software Engineering 2 project began as a tic-tac-toe game, then changed to Connect 4 to make the assignment more complex. That shift introduced a larger board, longer sequences of turns, and more state to preserve throughout a match.
The game was designed for two people sharing one device. Beyond normal play, it keeps a move history so players can return to an earlier turn after a mistake or explore how a different move could change the outcome. Highscores persist in the browser's local storage.
01 / Product Rules
Make a small game useful beyond one uninterrupted match.
The project stayed intentionally local, but the history and score features gave the experience memory within and across sessions.
Shared-device play
Two players take turns on the same computer, keeping the interaction direct and avoiding unnecessary networking scope.
Move history
Each turn is preserved so players can revisit an earlier point in the match instead of treating every move as irreversible.
Local highscores
Browser storage keeps the highscore table available after the page is closed and reopened on the same device.
02 / State Model
Represent the match as a sequence of recoverable states.
The history requirement changed the implementation from tracking only the current board to preserving how the board reached that point.
Board state
The interface needs one reliable representation of occupied spaces, whose turn it is, and whether the current position ends the game.
History state
Saving earlier positions makes time travel possible without attempting to reverse individual mutations after the fact.
Persistent state
The highscore table belongs outside an individual match and uses local storage to survive a browser refresh.
03 / Continuation
Bring the original class project into the current portfolio.
The hosted version preserves the project idea while making it playable without asking visitors to clone and run the original repository.
Original evidence
This case study keeps the animated preview from the coursework version so the earlier implementation remains visible.
Playable adaptation
The portfolio includes a Next.js and TypeScript adaptation with the same local two-player, history, and highscore goals.
Practical lesson
A familiar game became a compact way to practice state transitions, recoverable history, and browser persistence together.