/Checkers-MERN

Our team has created a checkers website where users will be able to play checkers against an AI agent on a variety of different difficulties. Each game is tracked and stored in the user’s profile and based on their performance they will be placed on the leaderboard

Primary LanguageJavaScript

CHECKERS GAME WEBSITE :

Members:

1) Atharva Patil

2) Sahil Kedare

2) Aryan Devikar

TOOLS USED :

For our project, we have decided to use the following Tech stack.

● MongoDB ● Express JS ● Node JS ● HTML ● Bootstrap ● Javascript ● Chart.JS ● Dark.JS

FLOW OF PROJECT:

At the top there is a navbar with which user can navigate to Home, Rules, Contact Us, Leaderboard and Profile pages. The “New Game” button at the top of the home page creates a new game, the "change theme" button changes board theme and there is a "check score" button to check users score.

ABOUT PROJECT:

Our project topic is an CHECKERS GAME WEBSITE. This website consists of 6 major sections to which we can navigate with the help of navbar. The six different pages are Login/Registration section, Home section, Rules section, Contact Us section, Leaderboard section and Profile section.

2. Login/Register :

Users who are new to the site can register and create a username and password, which they will use to logIn. If a user happens to forget their password, they will be able to reset it by providing their email address and then filling in their new password.

2. Home :

The Checkers AI game is located on this page, which is the most essential page on our website. The username is displayed in the navbar at the top. After the game is completed, the winner's name is displayed, as well as the winner's score. The game's score is determined by the number of movements performed by the players. We also have a variety of board themes to keep the game fresh.

3. Rules :

Since many users could be playing checkers for the first time, we decided to offer a rules page, which lists all of the rules in detail and walks the user through the various aspects of the game. Some people may prefer video tutorials, so we've included one on our rules page to assist newcomers in understanding and playing the game.

4. Contact Us :

Users can directly contact us in order to provide us with any feedback regarding our website or to raise any queries which they may have regarding the same. They can also provide some ideas for our website which we may implement in the future. Users can fill in the form and enter the appropriate information.

5. Leaderboard :

We've chosen to establish a ranking system for users who can defeat our agent in the fewest moves possible, where users must play precisely where users must play swiftly and efficiently. Players can compete against one another to see who can defeat our agent in the shortest amount of moves.As people compete for the top spots on the leaderboards, this will add a competitive element to our site.

6. Profile :

Users can examine their profile on this page, which includes basic information such as their name, email, highest score, total games, wins, losses, and their scoring statistics. Users can keep track of how many games they've played as well as their win/loss ratio or accuracy using this tab.

7. Learning Outcomes:

Creating an interactive user interface using HTML, CSS and Javascript Creating a leaderboard system by deciding the score of each user in each game Implementing NodeJS and MongoDB into our backend to store the user’s data and their game scores Integrating an AI agent whom the users will be playing against.



SNAPSHOTS OF OUR WEBSITE :

1. login/Register Page:

GitHub Logo

GitHub Logo

GitHub Logo

2. Home Page :

GitHub Logo

3. Rules Page :

GitHub Logo

4. Contact Page :

GitHub Logo

5. Leaderboard Page :

GitHub Logo

6. Profile Page :

GitHub Logo

7. Conclusion :

We have implemented an AI agent which can play Checkers with the help of minimax algorithm and alpha-beta pruning. We have created a website around the game which provides various features such as a dark mode, leaderboard system and profile page.

Thank You:grinning: