Projects

Puzzle Game

2022·1 min read

React
JavaScript
CRA
LinkGitHub

The board starts shuffled with one empty slot. Click any tile adjacent to the empty slot to slide it in — solve the puzzle by arranging the tiles in order with the gap at the end.

Classic sliding-tile puzzle — slide numbered tiles on a 4×4 board until they're ordered 1 → 15.

🚀 Try it live →

The board starts shuffled with one empty slot. Click any tile adjacent to the empty slot to slide it in — solve the puzzle by arranging the tiles in order with the gap at the end.

✨ Features

  • Click-to-slide tiles — only tiles next to the empty slot move (with row-edge awareness so tiles don't wrap)
  • Shuffled start — the board randomizes on every new game
  • Move counter — tracks how many slides you've made
  • Win detection — pops a "Congratulations!" screen when the board is solved
  • New Game / Reset — reshuffle and zero the counter at any time
  • Play Again — restart instantly after winning

🛠️ Tech Stack

  • Framework — React 18 (Create React App)
  • Language — JavaScript
  • Styling — CSS Modules

🙌 Credits

Built by Mohamed Gado.

More projects

  • Meals App2022 · React Native
  • Old Portfolio2022 · React
  • Shopping Cart2022 · React
All projects