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.
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.
- 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
- HTML5
- CSS3
- JavaScript
- jQuery
To run this project locally, follow these steps:
-
Clone the repository:
git clone https://github.com/amarhany20/Jquery-Connect-4-Game.git
-
Navigate to the project directory:
cd Jquery-Connect-4-Game
-
Open the
index.html
file in your preferred web browser.
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.
- Basic Connect 4 game using jQuery for DOM manipulation.
- Color-based win detection logic.
- Simple user prompts for player names and turn indication.
- 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.
- 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.
This link is here for trying out the game hosted on GitHub Pages: Connect 4 Game