Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/creatlydev/tic-tac-toe-react
Juego de Tic-Tac-Toe utilizando react, con almecanamiento en local storage
https://github.com/creatlydev/tic-tac-toe-react
Last synced: about 1 month ago
JSON representation
Juego de Tic-Tac-Toe utilizando react, con almecanamiento en local storage
- Host: GitHub
- URL: https://github.com/creatlydev/tic-tac-toe-react
- Owner: Creatlydev
- Created: 2024-09-11T17:29:42.000Z (3 months ago)
- Default Branch: main
- Last Pushed: 2024-09-12T03:25:40.000Z (3 months ago)
- Last Synced: 2024-09-12T12:46:02.822Z (3 months ago)
- Language: JavaScript
- Size: 257 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# 🕹️ Tic Tac Toe - React Game
Este es un proyecto de **Tic Tac Toe** desarrollado con **React**, como parte de mi aprendizaje de esta librería. El objetivo del proyecto es crear una aplicación interactiva, amigable con el usuario, que permita jugar partidas de Tic Tac Toe, guardar el estado del juego y agregar algunas animaciones para hacer la experiencia más divertida. 🎉
## 📜 Características
- **Juego interactivo de Tic Tac Toe** con opción para reiniciar la partida.
- **Guardar estado en LocalStorage**: Permite continuar la partida si cierras la ventana del navegador.
- **Animación de confetti** cuando un jugador gana 🎉.
- **Reproducción de sonido**: Efectos de sonido al realizar jugadas y al cambiar el estado del sonido. 🎵
- **Indicador de turnos** que muestra si le toca jugar a la X o al O.
- **Registro de victorias y empates** en tiempo real.
- **Controles de historial**: Navega entre los movimientos de la partida con botones de retroceder y avanzar.
## ⚛️ Tecnologías Utilizadas
- **React**: La librería principal utilizada para crear los componentes del juego y manejar el estado.
- **Hooks personalizados**: Utilizados para encapsular la lógica del juego, como la actualización del tablero, el turno del jugador y la verificación de ganadores.
- **LocalStorage**: Para persistir el estado del juego entre sesiones.
- **Canvas-Confetti**: Utilizado para mostrar una animación de confetti cuando hay un ganador.
- **Sonidos precargados**: Usados para reproducir efectos al hacer clic y al ganar la partida.
- **JavaScript Vanilla**: Para reproducir sonidos en cada movimiento de los jugadores.
## 🛠️ Instalación y Uso
1. Clona el repositorio:
```bash
git clone https://github.com/creatlydev/tic-tac-toe-react.git
```
2. Accede al directorio del proyecto:
```bash
cd tic-tac-toe-react
```
3. Instala las dependencias:
```bash
npm install
```
4. Inicia la aplicación:
```bash
npm run dev
```
---
¡Gracias por echarle un vistazo! 😊 Si te gustó el proyecto, no dudes en dejar un ⭐.
## 📝 Licencia
Este proyecto está bajo la licencia MIT.