Connect 4 Game

Welcome to the Connect 4 game project! This project demonstrates the use of jQuery for creating an interactive Connect 4 game in the browser. The project is part of the Python and Django Full Stack Web Developer Bootcamp by Pierian.

Table of Contents

• Connect 4 Game
  • Table of Contents
  • Introduction
  • Features
  • Technologies Used
  • Installation
  • Usage
  • Versions
    • Version 1
    • Version 2
    • Version 3
  • Try It Out

Introduction

Connect 4 is a two-player connection game in which the players take turns dropping colored discs from the top into a seven-column, six-row vertically suspended grid. The objective of the game is to be the first to form a horizontal, vertical, or diagonal line of four of one's own discs.

Features

• Interactive game board created with HTML and styled with CSS
• Dynamic gameplay using jQuery for DOM manipulation
• Responsive design for various screen sizes
• Simple and intuitive user interface

Technologies Used

• HTML5
• CSS3
• JavaScript
• jQuery

Installation

To run this project locally, follow these steps:

1. Clone the repository:

   git clone https://github.com/amarhany20/Jquery-Connect-4-Game.git

2. Navigate to the project directory:

   cd Jquery-Connect-4-Game

3. Open the index.html file in your preferred web browser.

Usage

To play the game, open the index.html file in a web browser. The game board will be displayed, and you can start playing by clicking on the columns to drop your discs. The game will automatically detect a win or a draw and will display a message accordingly.

Versions

Version 1

• Basic Connect 4 game using jQuery for DOM manipulation.
• Color-based win detection logic.
• Simple user prompts for player names and turn indication.

Version 2

• Improved UI with additional status and history displays.
• Bug fixes and enhancements for a smoother gaming experience.
• Added a refresh button to restart the game without reloading the page.

Version 3

• Optimized game logic using a 2D array to track the state of the game instead of relying on button colors.
• More efficient win detection algorithm.
• Clear separation of game state and UI logic.
• Enhanced performance and maintainability.

Try It Out

This link is here for trying out the game hosted on GitHub Pages: Connect 4 Game