--- title: "Connect Four" description: "A public real-time multiplayer Connect Four game with a 3D board, room invite codes, and server-backed game state." url: "https://briansunter.com/projects/connectfour" --- Feb 13, 2025 Launched Status checked Sep 15, 2026 # Connect Four A public real-time multiplayer Connect Four game with a 3D board, room invite codes, and server-backed game state. [Visit Project](https://connectfour.briansunter.com) React TypeScript Socket.io Three.js PostgreSQL  ## Overview A multiplayer Connect Four game I built to learn React Three Fiber and shore up my real-time stack. Players create rooms, share invite codes, and play head-to-head; the board is rendered in 3D so pieces actually drop into the slots. ## Features - Real-time play over WebSockets - Rooms with shareable invite codes - 3D board rendered with React Three Fiber - Animated piece drops and win highlight - Mobile-friendly layout ## Technology Stack - React + TypeScript on the frontend - Socket.io for the game channel - Express backend with sessions - PostgreSQL via Drizzle ORM - Redis for Socket.io scaling across processes - Docker Compose for deployment ## How It Works Players join a room with a short code. Game state lives on the server; every move broadcasts to the room over Socket.io and re-renders for both players. The 3D board is the same React Three Fiber scene on both sides, just with mirrored camera positions. ## Related projects - [BlockSignal](/projects/blocksignal) [An in-development fail-open blocker detection and recovery SDK for publishers, with separate blocker evidence and environment-health reporting.](/projects/blocksignal) - [CuckooTimer](/projects/cuckootimer) [A macOS menu-bar cuckoo clock app with a 3D scene, configurable intervals, and a $3.99 one-time purchase from the Mac App Store.](/projects/cuckootimer) - [Reply Tidy](/projects/reply-tidy) [A high-performance webhook system that moderates Threads comments with OpenAI, combining free keyword rules with batched AI moderation and a human review queue.](/projects/reply-tidy) ## Share this project