https://github.com/blopez024/react-tic-tac-toe
A simple and interactive Tic-Tac-Toe game built with React, featuring dynamic player turns, game history tracking, and winner detection with a responsive UI.
https://github.com/blopez024/react-tic-tac-toe
css javascript reactjs vitejs
Last synced: 4 months ago
JSON representation
A simple and interactive Tic-Tac-Toe game built with React, featuring dynamic player turns, game history tracking, and winner detection with a responsive UI.
- Host: GitHub
- URL: https://github.com/blopez024/react-tic-tac-toe
- Owner: blopez024
- License: mit
- Created: 2024-09-10T19:16:14.000Z (almost 2 years ago)
- Default Branch: main
- Last Pushed: 2024-09-18T19:11:35.000Z (almost 2 years ago)
- Last Synced: 2025-10-28T15:51:22.544Z (8 months ago)
- Topics: css, javascript, reactjs, vitejs
- Language: JavaScript
- Homepage: https://blopez024.github.io/react-tic-tac-toe/
- Size: 150 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# React Tic-Tac-Toe
A simple Tic-Tac-Toe game built using React and Vite.
### Table of Contents
- [Demo](#demo)
- [Features](#features)
- [Getting Started](#getting-started)
- [Installation](#installation)
- [Usage](#usage)
- [Contributing](#contributing)
- [License](#license)
### Demo
- [Live Demo](https://blopez024.github.io/react-tic-tac-toe/)
### Features
- Interactive 3x3 Tic-Tac-Toe board.
- Keeps track of the players' turns.
- Displays the winner or declares a draw.
- Built entirely using Vite + React.
### Getting Started
These instructions will help you set up the project on your local machine.
### Installation
1. Clone the repository:
```bash
git clone https://github.com/blopez024/react-tic-tac-toe.git
cd react-tic-tac-toe
```
2. Install dependencies:
```bash
npm install
```
3. Start the development server:
```bash
npm run dev
```
This will start the app at http://localhost:5173
### Usage
To play the game:
- Open your browser and go to http://localhost:5173.
- Play Tic-Tac-Toe against yourself or a friend!
- The first player to get three of their symbols in a row (horizontally, vertically, or diagonally) wins.
Project Structure
```bash
Copy code
react-tic-tac-toe/
├── [public]/ # Public directory for static assets
│ └── vite.svg # SVG file used in the project, often for branding or icons
├── [src]/ # Source directory for your application's code
│ ├── App.css # CSS file for styling the App component
│ ├── App.jsx # Main React component for the application
│ ├── index.css # Global CSS file for general styles
│ └── main.jsx # Entry point for the React application
├── index.html # HTML file where the React app is rendered
├── vite.config.js # Configuration file for Vite, the build tool
├── package.json # Project metadata and dependencies
└── README.md # Documentation file with project details and setup instructions
```
# Contributing
If you'd like to contribute to this project, feel free to submit pull requests or open issues. Here's how you can contribute:
1. Fork the repository.
2. Create a new branch (`git checkout -b feature-branch`).
3.Commit your changes (`git commit -m "Added some feature"`).
3. Push to the branch (`git push origin feature-branch`).
4. Open a pull request.
### License
This project is licensed under the MIT License.