Connect Four Game

This project was bootstrapped with Create React App.

Overview

This is a React application implementing the classic Connect Four game. Players can set up a game by entering their name, choosing a game name, background color, and player color. The game allows users to play against an AI opponent.

Table of Contents

• Installation
• Usage
• Features
• Gameplay
• Game History

Installation

To run this project locally:

 git clone https://github.com/your-username/connect-four.git

Navigate to the project directory:

 cd connect-four

Install dependencies:

 npm install

Start the development server:

 npm start

Open http://localhost:3000 in your browser.

Usage

• Enter your username and game details in the setup screen.
• Choose a background color and player color.
• Click "Start Game" to begin playing against the AI.
• View the game history to see the outcomes of previous games.

Features

• Set up game configurations with personalized details.
• Play against an AI opponent.
• View game history, including the winner of each game.

Gameplay

Setup Screen:

Enter your username, game name, background color, and player color. Click "Start Game" to begin playing.

Game Board:

Play the Connect Four game by clicking on the cells to drop your colored discs. The game alternates turns between the player and the AI.

Game Over:

When the game is over (either a player wins or it's a draw), a modal will appear showing the winner or indicating a draw. Click "New Game" or "Restart" to play again.

Game History

• View a list of past games in the "Game History" section.

• Each entry includes the game name, players' names, and the winner of the game.

  

  Contribution and Development

Developers who want to contribute to the project can do so by forking the GitHub repository or by reporting issues, thus contributing to the project's development. Any feedback and suggestions will help further improve the project. The project is an open-source project developed by the community. We look forward to your participation!

https://chat.openai.com/share/1203c0f0-cd2e-47f5-9fc2-39963b6942ce

https://chat.openai.com/share/5112d402-04de-49b5-9f07-8725fb6a0db2

https://chat.openai.com/share/1dbff71d-15a7-4192-88b9-c3cc54440591