15 Puzzle Game

A 15 puzzle game built with React, featuring shuffling, solvability check, and a hint system. The puzzle is designed to provide an engaging and challenging experience for users.

Table of Contents

• Features
• Installation
• Usage
• Components
• Contributing

Features

• Start New Game: Shuffle the puzzle and start a new game.
• Solvability Check: Ensures that the shuffled puzzle can be solved.
• Tile Click: Move tiles by clicking on them.
• Hint System: Get hints to help solve the puzzle.
• Responsive Design: Optimized for both desktop and mobile devices.

Installation

1. Clone the repository:

   git clone https://github.com/your-username/sliding-puzzle-game.git
   cd sliding-puzzle-game

2. Install dependencies:

   npm install

3. Start the development server:

   npm start

The game should now be running at http://localhost:3000.

Usage

• Start New Game: Click the "START NEW GAME" button to shuffle the puzzle and start a new game.
• Shuffle: Click the "SHUFFLE" button to reshuffle the puzzle.
• Help Me: Click the "HELP ME" button to get a hint for the next move (enabled only if the puzzle is solvable).
• Move Tiles: Click on a tile adjacent to the empty space to move it.

Components

Game

The main component that manages the state of the puzzle, handles user interactions, and renders the game.

Tile

A component that represents an individual tile in the puzzle.

Tag

A component that displays whether the current puzzle is solvable or not.

SolvePuzzle

A module that contains the logic for solving the puzzle and providing hints.

IsSolvable

A module that contains the logic to check if the puzzle is solvable.

Contributing

Contributions are welcome! Please follow these steps:

1. Fork the repository.
2. Create a new branch (git checkout -b feature-branch).
3. Make your changes and commit them (git commit -m 'Add new feature').
4. Push to the branch (git push origin feature-branch).
5. Open a pull request.