Play Four in a Row

A four in a row strategy board game built with plain JavaScript. Drop discs into the grid and connect four of your colour to win. Play against a minimax computer opponent or a friend on one device.

This is a real, playable game, not a screenshot. Tap a column, watch your disc fall, and race to line up four before your opponent does. The computer side runs a genuine game tree search, which makes this a compact tour of two ideas at the heart of game logic, scanning a grid for a winning pattern and looking several moves ahead.

How to play

Two players take turns dropping discs into a seven by six grid. A disc falls to the lowest free slot in the column you choose, and the first player to line up four of their own colour in a row wins, whether that line runs across, straight up, or along a diagonal. Fill the board with no four in a row and the game is a draw. Tap any column to drop there. Play the computer to sharpen up, or pass the device back and forth with a friend.

Modes and strategy

The same board, two ways to play, and a lot more depth than it first looks.

One player versus the computer

The yellow side is driven by a search that looks several moves ahead, takes any winning move, and blocks yours. It favours the centre column because that is where the most winning lines cross, so beating it means setting up two threats it cannot block at once.

Two player on one device

Choose two player and simply hand the phone over after each turn. The colour to move is always shown at the top, so nobody loses track of whose turn it is.

The double threat

The whole game hinges on making two ways to win at the same time. Watch for open ended rows of three and for spots where a single disc would complete two different lines.

How this game is built

Four in a Row packs two classic computer science ideas into a small board.

Scanning the grid for a win

After every drop the code slides a four cell window across every row, column, and diagonal looking for four of a kind, the same pattern scanning used to detect lines, shapes, and matches in many games and tied closely to game state management.

Searching ahead with minimax

The computer builds a small tree of possible futures, scores each one, and assumes you will play your best reply, the minimax idea with alpha beta pruning to skip branches that cannot change the result. Your taps reach it through the same path as handling game input.

Why this is real game AI

The opponent here is a genuine, if tiny, game playing agent. Minimax and its pruning are the same family of algorithms that powered the first computers to beat humans at checkers and chess, just at a much smaller depth. Once you understand looking ahead, scoring a position, and assuming a smart opponent, you have the core of countless turn based AIs. The board scanning, meanwhile, is the same trick behind line clears, match detection, and the reactive checks that drive an event driven UI.

Frequently asked questions

How do I play Four in a Row?

Tap a column to drop your disc, which lands in the lowest free slot. Be the first to connect four of your colour in a line, across, up and down, or diagonally, to win.

What modes are there?

One player against a computer opponent, and a two player game where you share one device and take turns. The current colour to move is always shown at the top.

How strong is the computer?

It looks several moves ahead with a minimax search, always takes a winning move, blocks your immediate threats, and prefers the centre, so you usually need a double threat to beat it.

How does this relate to programming?

It combines scanning a grid for patterns with a minimax game tree search, two foundational ideas in game logic and artificial intelligence.