Link - https://vinayakrevankar.com/syllablast-game/
Syllablast is an interactive puzzle game designed to challenge users in arranging syllables to form words. The game provides different configurations and tracks user swaps, score, and completion status.
- Dynamic Configurations: Choose from various syllable arrangements.
- Real-time Feedback: Users receive immediate feedback on their syllable placements.
- Undo Functionality: Easily revert your last swap.
- Score Tracking: Keep track of your progress and score based on correct placements.
- Next.js: Framework for server-rendered React applications.
- TypeScript: Typed superset of JavaScript for better code quality and maintainability.
- CSS-in-JS: Styled components for styling and layout.
- Syllable: Represents each syllable in the game.
- Configuration: Holds the initial syllable arrangements and valid words.
- Puzzle: Manages the game state, including syllable selection, swapping, scoring, and checking for completion.
- Model: Acts as the interface between the game state and the UI.
selectSyllable(row, col): Selects a syllable at the specified row and column.swapSelectedSyllables(): Swaps the two selected syllables.updateCorrectness(): Updates syllable correctness and score based on current placements.undoLastSwap(): Reverts the last swap made by the player.resetPuzzle(): Resets the puzzle to its initial state.
To run Syllablast locally, follow these steps:
- Clone the repository:
git clone https://github.com/Vinayakrevankar/Syllablast-Game
- Navigate to the project directory:
cd Syllablast-Game
- Install the required dependencies:
npm install
- Start the development server (Game):
npm run dev
- Open your browser and go to http://localhost:3000 to play the game.