Connect Four is a browser based game that accepts two players as opponents. In the game, players take turns choosing an index on the game board to place their chip, starting from the bottom row. Once a column is chosen, the chip will slot into the lowest spaces in each column.
Hint: Something to keep in mind is that simply knowing the rules of Connect 4 will not guarantee you a win. You need to work on your strategy and technique in order to increase your chances of winning.
- HOW TO PLAY:
- First, players decide who goes first by simply clicking one of the circles (player 1 is red)
- Players will alternate turns by placing their chip in a circle then letting the other player do the same
- Players must CONNECT FOUR of the same colored chips in a row to win
- Only one chip can be played at a time
- The game ends when there is a 4-in-a-row in any direction or a tie
- Have fun!
Play Connect Four Here
-
Sound
-
Timer
-
Dark Mode
-
CPU Player
-
Accessibility features (keyboard input, colorblind settings)
-
Confetti
- Create board in html
- Style Board 6 by 7 (42 indexes)
- Define variables
- Store cached element references
- Define constants
- When the game is loaded it needs to be initialized
- Player 1 turn will be 1, player 2 turn will be -1
- Create render function
- Create updateBoard function
- Create updateMessage function
- Create handleClick function
- Attach event listener to game board
- Create placeChip function (account for gravity here)
- Create checkForTie function
- Create checkForWinner function
- Create switchPlayerTurn function
- Create Reset Button html