Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/janubhav/tileshift

It is a sliding tile game 🎮 where players rearrange tiles 🔢 within an n×n grid ⏹️ to achieve a specific goal, typically in numerical order 🔢➡️✅.
https://github.com/janubhav/tileshift

Last synced: 7 days ago
JSON representation

It is a sliding tile game 🎮 where players rearrange tiles 🔢 within an n×n grid ⏹️ to achieve a specific goal, typically in numerical order 🔢➡️✅.

Host: GitHub
URL: https://github.com/janubhav/tileshift
Owner: jAnubhav
Created: 2025-01-30T04:51:17.000Z (22 days ago)
Default Branch: main
Last Pushed: 2025-02-04T17:45:13.000Z (17 days ago)
Last Synced: 2025-02-04T18:37:10.020Z (17 days ago)
Language: JavaScript
Homepage:
Size: 93.8 KB
Stars: 0
Watchers: 1
Forks: 0
Open Issues: 0
Metadata Files:
- Readme: README.md

Awesome Lists containing this project

README

# TileShift

TileShift is a React-based puzzle game where players must shift tiles strategically to solve the puzzle. The game features three difficulty levels: Beginner, Intermediate, and Advanced.

## Features 🚀
- **Multiple Difficulty Levels**: Choose from Beginner, Intermediate, and Advanced modes.
- **Dynamic Grid System**: The game board adapts to the chosen difficulty.
- **Win Detection**: The game detects when a player has successfully solved the puzzle.

## Technologies Used 🛠

- **ReactJS**: For building the user interface.
- **Context API**: Manages game state across components.
- **CSS**: For styling and animations.

## Installation 📥

1. Clone the repository:
```bash
git clone https://github.com/yourusername/tileshift.git
cd tileshift
```

2. Install dependencies:
```bash
npm install
```

3. Start the development server:
```bash
npm start
```

## File Structure 📁

```php
TileShift/
│── src/
│ ├── components/
│ │ ├── display/
| | | ├── ChoiceCard.jsx
| | | └── MenuDisplay.jsx
│ │ ├── grid/
│ │ | ├── Cell.jsx
│ │ | ├── Grid.jsx
| │ │ └── GridHolder.jsx
│ │ └── win/
| | └── WinScreen.jsx
│ ├── contexts/
│ │ ├── VisContext.jsx
│ │ └── GridContext.jsx
│ ├── App.jsx
| └── index.jsx
│── index.html
└── README.md
```
## How to Play 🎮

1. Select a difficulty level from the menu.
2. The grid will generate based on your selection.
3. Shift the tiles to solve the puzzle.
4. Once completed, a win screen will appear.

## Contribution 🤝

1. Fork the repository.
2. Create a new branch:
```bash
git checkout -b feature-branch
```
3. Commit your changes:
```bash
git commit -m "Add new feature"
```
4. Push to your branch:
```bash
git push origin feature-branch
```
5. Submit a Pull Request.

## Credits

Made with ❤️ by [jAnubhav](https://github.com/jAnubhav).