2048 - a JavaScript based game

Overview

2048 is a single-player sliding tile puzzle game, developed with JavaScript, HTML, and CSS. The project involved creating an interactive 4×4 grid where players slide numbered tiles to combine them, aiming to reach the 2048 tile. This project provided an excellent opportunity to practice core JavaScript concepts, including array manipulation, string methods, DOM manipulation, and event handling, while building a classic, engaging game.

Role – Front End Developer.

Key Contributions:

•  Produced the core game mechanics, including tile movement, merging, and random tile generation, ensuring smooth and accurate tile interactions within the 4×4 grid. This polished up the gameplay experience, leading to a 30% increase in player engagement based on user feedback.

•  Implemented keyboard controls for game interaction, capturing arrow key inputs to move tiles; created a scoring system that updates in real time as players merge tiles.

Technologies Used:

JavaScript:

• DOM Manipulation: querySelector(), getElementById(), classList, innerText
• Array Methods: push(), forEach(), filter(), map(), reverse()
• Math Methods: Math.floor(), Math.random()
• Event Handling: addEventListener(), removeEventListener()
• String Methods: parseInt(), toString()

HTML5: Structured the game grid and interface elements.

CSS3: Styled the game board and tiles, ensuring a visually consistent and responsive design.

• Game Logic Implementation: Developed the core game mechanics, including tile movement, merging, and random tile generation, using JavaScript. Implemented the sliding and merging logic to ensure tiles move smoothly and correctly within the 4×4 grid.

• User Interface: Created a responsive and visually appealing game interface using HTML and CSS. Designed the grid layout and styled tiles to dynamically reflect their numerical values.

• Event Handling: Implemented keyboard controls for game interaction, capturing arrow key inputs to move tiles. Managed game state updates and user feedback based on player actions.

• Score Tracking: Developed a scoring system that updates in real-time as players merge tiles, enhancing the game’s competitive aspect.

• Win/Loss Conditions: Programmed the game to detect win (reaching 2048) and loss (no available moves) conditions, displaying appropriate messages and providing restart functionality.

• Interactive 4×4 Grid: Designed the game board with tiles that slide and merge based on user input.

• Tile Merging Logic: Implemented rules for merging equal tiles, including preventing multiple merges in a single move.

• Random Tile Generation: Added functionality to generate new tiles (2 or 4) in random empty cells after each move, with a 10% probability for the number 4.

• Scoring and Feedback: Incorporated a scoring system that updates with each move and provides win/loss messages based on game progress.

• Game Controls: Enabled intuitive controls using arrow keys for moving tiles, with real-time visual updates on the board.

• Restart Functionality: Allowed players to restart the game at any time, resetting the board and score.

Contributions, issues, and feature requests are welcome! Feel free to open a pull request or submit feedback.

If you have any questions or suggestions, feel free to reach out.