Skip to main content

Documentation Index

Fetch the complete documentation index at: https://mintlify.com/Ashokaas/BeeHex/llms.txt

Use this file to discover all available pages before exploring further.

Welcome to BeeHex! This guide will walk you through everything you need to start playing Hex online, from creating your account to completing your first game.

​
What is Hex?

Hex is a strategic board game where two players compete to connect opposite sides of a hexagonal board with an uninterrupted chain of their colored pieces. The first player to connect their sides wins!
BeeHex supports multiple board sizes (5x5, 7x7, 9x9) and offers both online ranked matches and offline local games.

​
Getting Started

1

Access BeeHex

Navigate to the BeeHex web application in your browser. The app is a Progressive Web App (PWA), meaning you can install it on your device for quick access.
You can play offline games without creating an account! Just visit the home page and click “Try now” to start a local game immediately.
2

Create Your Account

To play online matches and track your MMR (Match Making Rating), you’ll need to create an account.Navigate to the Login/Register page and enter your credentials:
// The authentication system uses simple username/password
// From: src/app/login_register/page.tsx

const handleSubmit = async (e, type: 'login' | 'register') => {
  e.preventDefault();
  const url = type === 'login' 
    ? `http://${getEnv()["IP_HOST"]}:3001/login` 
    : `http://${getEnv()["IP_HOST"]}:3001/register`;

  const response = await axios.post(url, 
    { username, password }, 
    { withCredentials: true }
  );
};
Your account credentials are securely stored and authenticated via cookies. Make sure to choose a strong password!
Fill in the form:
  • Username: Choose a unique username that will be displayed to other players
  • Password: Create a secure password
Click “Inscription” (Register) to create your account, or “Connexion” (Login) if you already have one.After successful authentication, you’ll be redirected to the home page.
3

Choose Your Game Mode

Once logged in, navigate to the Game Mode page to configure your match settings.You’ll see several options:

​
Game Type

Choose between:
  • Normal: Casual games for practice
  • Classé (Ranked): Competitive games that affect your MMR
  • Hors-Ligne (Offline): Local games without requiring an internet connection

​
Time Limit

Select your preferred time limit in seconds. Available options are defined in the app:
// From: src/app/definitions.ts
export const TIME_LIMITS = [0]; // Currently supports untimed games

​
Board Size

Choose from three board sizes:
// From: src/app/definitions.ts
export const BOARD_SIZES = [5, 7, 9];
  • 5x5: Quick games, perfect for beginners
  • 7x7: Standard competitive size
  • 9x9: Advanced strategic gameplay

Quick Match

Select “Normal” mode, 7x7 board, and “Chercher une partie” to find an opponent quickly.

Private Game

Choose “Partie privée” and share the game code with a friend to play together.
4

Find an Opponent

After configuring your game settings, click “Jouer” (Play) to search for an opponent.

​
For Public Games

The matchmaking system will search for an available opponent:
// From: src/app/game_mode/page.tsx

websocketHandler.sendPacket({
  type: ServerBoundPacketType.GAME_SEARCH,
  game_parameters: {
    time_limit: parseInt(timeLimit),
    board_size: parseInt(boardSize),
    ranked: gameType === "Classé",
  }
} as ServerBoundGameSearchPacket);
You’ll see a loading screen while the system finds a match. Once an opponent is found, you’ll be automatically redirected to the game board.

​
For Private Games

Enter a game code to create or join a private room:
// From: src/app/game_mode/page.tsx

websocketHandler.sendPacket({
  type: ServerBoundPacketType.JOIN_ROOM,
  room_id: gameCode,
  game_parameters: {
    time_limit: parseInt(timeLimit),
    board_size: parseInt(boardSize),
    ranked: false
  }
} as ServerBoundJoinRoomPacket);
Game codes can contain numbers only. The app automatically converts certain keyboard characters to numbers for easier code entry on mobile devices.
5

Play Your First Game

Once the game starts, you’ll see the hexagonal board with player information displayed at the top.

​
Game Interface

The game page shows:
  • Player names: Your username and your opponent’s username
  • Timers: Remaining time for each player (displayed as “X:XX”)
  • Hexagonal board: The playing field where you place your pieces
  • Recent games: Your game history with MMR changes (visible in the game mode page)

​
Making Moves

The gameplay system handles move validation and updates:
// From: src/app/hex/[gameId]/page.tsx

function onlineClickCallback(i: number, j: number) {
  if (workingGameState === GameState.PLAYING && 
      game && 
      game.isTurnOf(ownId) && 
      game.isValidMove(i, j)) {
    websocketHandler.sendPacket({
      type: ServerBoundPacketType.PLAY_MOVE,
      x: i,
      y: j
    } as ServerBoundPlayMovePacket);
  }
}
To make a move:
  1. Wait for your turn (the board will indicate when it’s your turn)
  2. Click on any empty (gray) hexagon on the board
  3. Your piece will appear in your color (red or blue)
  4. The turn automatically passes to your opponent
You can only place pieces on empty hexagons. Once a hexagon is occupied, it cannot be changed!

​
Winning the Game

Connect your two colored sides of the board with an uninterrupted chain of your pieces. The game automatically detects when a player has won:
// From: src/app/hex/[gameId]/page.tsx

function gameEndCallback(status: GameStatus, moves: string) {
  if ((ownId === player1Id && status === GameStatus.FIRST_PLAYER_WIN) || 
      (ownId === player2Id && status === GameStatus.SECOND_PLAYER_WIN)) {
    setT1("Victoire");
    setT2("Vous avez gagné");
    setShowEndGameAlert(true);
  } else {
    setT1("Défaite");
    setT2("Vous avez perdu");
    setShowEndGameAlert(true);
  }
}
When the game ends, you’ll see an alert indicating victory or defeat, and you can review the game moves.
6

Review Your Game

After a game ends, you automatically enter Review Mode. This powerful feature helps you analyze your gameplay:
  • Move slider: Navigate through all moves played during the game
  • Computer analysis: See the AI’s evaluation of each position
  • Recommended moves: View the top 4 suggested moves for each position
  • Optimal routes: Visualize winning paths highlighted by the analysis engine
// From: src/app/hex/[gameId]/page.tsx

// Review mode allows you to navigate through game history
useEffect(() => {
  if (gameState === GameState.REVIEWING) {
    setCurrentMoves(storedMoves!!.slice(0, sliderValue - 1));
  }
}, [sliderValue, gameState]);
Use the review feature to improve your strategy! The computer evaluation shows move strength and helps identify mistakes.
You can also access past games from your game history displayed on the Game Mode page.

​
Understanding Game Types

BeeHex uses a URL-based game identification system: 
// Online multiplayer games (format: o_gameId)
// Example: /hex/o_abc123
gameType = "online";

​
Tracking Your Progress

Your game history is displayed on the Game Mode page after logging in: 
// From: src/app/game_mode/page.tsx

const fetchUserLastGames = async () => {
  const userId = Cookies.get('userId');
  const gamesRes = await axios.get(
    `http://${getEnv()['IP_HOST']}:3001/get_games_by_user/${userId}`
  );
  setGamesArr(gamesRes.data);
};
For each game, you can see:
  • Result: Victory or defeat
  • Opponent: Username of your opponent
  • MMR Change: Rating points gained or lost
  • Current MMR: Your updated rating after the game

MMR System

The MMR (Match Making Rating) system tracks your competitive performance in ranked games. Win games to increase your rating and get matched with similarly skilled opponents!

​
Quick Tips

Start Simple

Begin with 5x5 boards to learn the basic strategies before moving to larger boards.

Control the Center

Controlling central hexagons often provides more connection options.

Block Strategically

Sometimes blocking your opponent’s connection is as important as building your own.

Review Your Games

Use the analysis feature to understand your mistakes and improve your play.

​
Next Steps

Now that you’ve completed your first game, explore more features:
  • Practice offline to refine your strategies without affecting your MMR
  • Play ranked matches to compete on the leaderboard
  • Analyze past games to identify and learn from your mistakes
  • Challenge friends with private game codes
The best way to improve at Hex is to play regularly and review your games with the built-in analysis engine!
Ready to dive deeper? Check out the full documentation to learn about advanced features and strategies.

Build docs developers (and LLMs) love

Get started for freeTalk to us