Case study
Connect Four
Play a friend online, watch a match, talk while you play, or take on the computer.
React
Redux
Framer Motion
TailwindCss
Node.Js
Express.JsProblem
Connect Four is simple at a table. Online, it isn't. Who's turn is it if the wifi drops? Can someone watch? Can you talk? And can the computer play well without the page freezing?
Approach
You create a short room code and send it to a friend. No accounts, no matchmaking queue — just the two of you, plus anyone you invite to watch. The server is in charge of the board, so a sneaky client can't drop a disc wherever it wants.
You can also play the computer. It thinks in the background so the game stays smooth, then waits a beat so it doesn't feel like a calculator. Voice is a call between the two players, not a chat room we have to host.
Decisions
Wifi dropping shouldn't end the game
If someone disconnects, the turn clock pauses. They have thirty seconds to come back. Same name, same room, same board. If they don't make it, the room closes. That's better than 'refresh and start over.'
The computer has to feel like a person
Easy guesses. Medium thinks a little. Expert thinks longer, likes the center column, and goes first. It isn't unbeatable — it just plays well enough to be annoying, without locking up the tab while it decides.
The room should feel occupied
Up to five people can watch. Quick messages (including Pidgin), emoji, a restart you both have to agree on. Win and you unlock achievements on that device.
Result
You can play a friend, watch a match, talk while you play, or take on the computer.