https://github.com/subhendu-kumar/tic-tac-toe

Tic Tac Toe is a traditional two-player game where players take turns marking a 3x3 grid. The goal is to get three of their symbols (X or O) in a row.
https://github.com/subhendu-kumar/tic-tac-toe

Last synced: 20 days ago
JSON representation

Tic Tac Toe is a traditional two-player game where players take turns marking a 3x3 grid. The goal is to get three of their symbols (X or O) in a row.

• Host: GitHub
• URL: https://github.com/subhendu-kumar/tic-tac-toe
• Owner: Subhendu-Kumar
• Created: 2024-02-01T15:56:23.000Z (11 months ago)
• Default Branch: main
• Last Pushed: 2024-03-04T12:55:05.000Z (10 months ago)
• Last Synced: 2024-03-04T14:07:17.903Z (10 months ago)
• Language: JavaScript
• Homepage: https://tic-tac-toe-subhendu.netlify.app/
• Size: 12.7 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# Tic-Tac-Toe

## Preview 

Link : [click here](https://tic-tac-toe-subhendu.netlify.app/)

The Tic Tac Toe game is implemented in HTML, CSS, and JavaScript.

Table of Contents

    HTML Structure

    CSS Styling

    JavaScript Logic

    Game Rules

    Responsive Design

1. HTML Structure 

The HTML structure defines the layout and elements of the Tic Tac Toe game. Key elements include the game board, buttons, and message containers.

    : Document type declaration for HTML5.

    : Root element.

    : Contains meta information, title, and links to stylesheets.

    : Main content area.

2. CSS Styling 

The CSS styles provide the visual appearance of the game. Key styling elements include the game board, buttons, and responsive design.

    body: Background color and general styling.

    .main-box: Styling for the game board.

    .box: Styling for individual game cells.

    .reset, .new: Styling for reset and new game buttons.

    .msg-container: Styling for the message container.

3. JavaScript Logic 

The JavaScript logic handles game mechanics, including player moves, checking for a winner, and resetting the game.

    const boxes: Selects all game cells.

    const resetBtn, const newGameBtn: Selects reset and new game buttons.

    const msgContainer, const msg: Selects message container and message elements.

    Functions: disableBox, enableBox, reSet, gameDraw, showWinner, checkWinner.

4. Game Rules 

The game follows standard Tic Tac Toe rules, where players take turns placing their symbols (X or O) on the board. The game ends when a player has three symbols in a row horizontally, vertically, or diagonally. A draw is declared if no player achieves a winning combination.

5. Responsive Design 

The game is designed to be responsive, with specific styles for smaller screens (max-width: 480px). This ensures a consistent user experience across different devices.

=======

Tic-Tac-Toe is a classic two-player game where the objective is to create a line of three of your own symbols (either "X" or "O") horizontally, vertically, or diagonally on a 3x3 grid.

Game Board: The game is played on a 3x3 grid.

Players: There are two players in the game, typically represented by "X" and "O."

Turns: Players take turns to place their symbol ("X" or "O") on an empty cell of the grid.

Objective: The goal is to create a line of three of your own symbols either horizontally, vertically, or diagonally.

Winning: The player who successfully forms a line of three of their symbols is declared the winner.

Draw/Tie: If the entire grid is filled, and no player has formed a winning line, the game is a draw or tie.

Blocking Opponent: Players often strategically place their symbols to block their opponent from forming a winning line.

Continuation: The game can be played in multiple rounds, and players take turns going first.

This Tic-Tac-Toe web app involves using HTML for the structure, CSS for styling, and JavaScript for interactivity.

>>>>>>> 3a3a02967538b6da2549673bea4f92d3048d0c42