This is the first game I developed for the web environment, my main goal was to build it with only HTML, CSS and vanilla JavaScript, without any kind of framework or library. Following the MVC pattern helped me to keep things organized.
With this project I learned a lot of multidimensional array and get the knowledge to do my second project as a puzzle: Angular Minesweeper.
The object of the fifteen puzzle is to place the tiles in order by making sliding moves that use the empty space whith as fewer moves as possible.
You can see the code on Github:
Manussakis
/
fifteen-puzzle-game
The classic Fifteen Puzzle Game made with Vanilla JavaScript.
Fifteen Puzzle Game
Rearrange the pieces with as few moves as possible
Instructions:
- In the "Shuffle moves" input, type how many moves you want the board to be shuffled with (any value between 1 and 80).
- Click on the "Shuffle" button and watch the pieces shuffling around.
- Try rearranging the board with the same (or even fewer) number of moves than it was initially shuffled by clicking on the pieces with space to move. The pieces should be placed in ascending order from left to right, up to down.
Development
- Clone this repository to your machine.
- Run
npm installto install all the dependencies. - Run
npm run startto start the server and openhttp://localhost:8080on the browser. The site will reload automatically when changes in the source files are saved.
Build
- Run
npm run buildto build the project. The built artifacts will be stored in thedist/…
Top comments (2)
"The Fifteen Puzzle Game, a classic brain-teaser, is meticulously crafted using vanilla JavaScript, offering a seamless experience for players. As you slide tiles to rearrange them into numerical order, immerse yourself in a challenge reminiscent of the puzzles found in the strand nyt. With each strategic move, unlock the next level of complexity, engaging your mind and providing hours of stimulating entertainment."
The Fifteen Puzzle Game built with vanilla JavaScript is impressive. It showcases pure coding skills without frameworks. Integrating Sound of Text for audio feedback can make it even more engaging. This classic game highlights the power and fun of vanilla JavaScript