In this project,we are building a Tic Tac Toe game made on Javascript.The tic-tac-toe game is created to play on the command line where two human players can play against each other and the board is displayed in between turns
Front-End(client)
- HTML + CSS
- JavaScript
- Bootstrap
Testing Frameworks
- Jest
To get a local copy up and running follow these simple example steps.
-
Node
-
Basic knowledge of npm/yarn
- Clone the repo
git clone https://github.com/Cyrus-Kiprop/Javascript-Tic-Tac-Toe.git
- CD into the project root directory
cd ./Javascript-Tic-Tac-Toe.git
- Install Dependencies and packages
npm install
- Build the files
npm run build
Open the index.html file using live servers.
right click on index.html file and open it with the browser or with live server.
http//localhost:8080
-
The game is played on a grid that's 3 squares by 3 squares.
-
You are X, your friend (or the computer in this case) is O. Players take turns putting their marks in empty squares.
-
The first player to get 3 of her marks in a row (up, down, across, or diagonally) is the winner.
-
When all 9 squares are full, the game is over. If no player has 3 marks in a row, the game ends in a tie.
Top-Left Top-Center Top-Right Middle-Left Middle-Center Middle-Right Bottom-Left Bottom-Center Bottom-Right
When you start the game, it's going to ask the name of the player1 and player2, and immediately after, a match will start. You can play as many matches as you want in a single game, and the game is going to show a Winners or a Draw depending on the game result.
We have 9 cell on the board as represented below.
|1|2|3|
|4|5|6|
|7|8|9|
The Player1 will start the game with 'X' mark on any of the 9 cell, once the player makes his change, the user gets toggled to player2 and so on. You can't re-assign a cell once you make the move or once the mark is placed for either 'X'or'O'.
The match is over if the winnning critera is met, or else the match will be a draw. One east result user gets an option to either 'Reset' or 'Restart' the game.
Reset - The data of Players will be not saved and the user need to provide the entire data once more at the beggining. Restart- The player is taken back to thr board, and the players can replay the game.
See the open issues for a list of proposed features (and known issues).
Contributions are what make the open source community such an amazing place to be learn, inspire, and create. Any contributions you make are greatly appreciated.
- Fork the Project
- Create your Feature Branch (
git checkout -b feature/NewAwesomeFeature
) - Commit your Changes (
git commit -m 'Add some NewAmazingFeature'
) - Push to the Branch (
git push origin feature/NewAmazingFeature
) - Open a Pull Request
👤 Cyrus Kiprop
- Github: Cyrus-Kiprop
- Twitter: @kipropJS
- Linkedin: Cyrus Kiprop
👤 Shubham Raj
- Github: @ShubhamRaj
- Linkedin: Shubham14p3
Give a ⭐️ if you like this project!
- Project requested by Microverse Program.
- Adding Validation.
- Adding AI Logic.
- Making the UI, Mobile friendly.