A modern, scalable Sudoku game. The project is developed with Vue 3, TypeScript, and Vite, and follows Clean Architecture and Atomic Design principles to ensure long-term maintainability, scalability, and testability.
The project uses .nvmrc to guarantee Node.js version consistency across environments.
# Automatically switch to the required Node version (v20.19.0)
nvm use
# Install dependencies
npm install
# Start development server
npm run devThe application will be available at: 👉 http://localhost:5173
The application is fully containerized to provide a consistent runtime environment.
# Build the Docker image
docker build -t sudoku-app .
# Run the container
docker run -d -p 8080:80 --name sudoku-container sudoku-appAccess the application at: 👉 http://localhost:8080
-
Framework: Vue 3 (Composition API)
-
Language: TypeScript
-
Build Tool: Vite
-
State Management: Pinia
- Modular stores:
Game,Score,Leaderboard,Theme
- Modular stores:
-
Styling: Tailwind CSS
-
Routing: Vue Router
-
Internationalization: Vue-i18n (Dynamic language switching)
-
Version Control: Application version automatically injected from
package.jsonvia Vite -
Testing: Vitest
-
Clean Architecture Clear separation between domain logic, infrastructure, and presentation layers.
-
Atomic Design UI components structured as:
- Atoms
- Molecules
- Organisms
- Templates
- Pages
-
Type Safety Strict TypeScript usage across domain and presentation layers.
-
Git Hooks & CI Discipline
- Husky pre-push hooks ensure the project builds successfully before code is pushed.
All features are implemented in alignment with the technical requirements.
-
Dynamic Difficulty Levels 4 difficulty ranks: Beginner, Easy, Medium, Expert
-
Draft Mode (Notes) Toggleable pencil mode for marking candidate numbers
-
Undo / Redo Full move history tracking with state-saving logic
-
Pause / Resume Game automatically pauses when the browser tab becomes inactive (Visibility API)
-
Advanced Scoring System
+5points for correct placement-1point for incorrect placement
- Progressive hint penalties
- Time-based completion bonus:
500 - elapsed time
-
Hint System Limited hints with decreasing score impact
-
Dark / Light Mode Flicker-free initial load with responsive theming
-
Multi-language Support English (EN) and Turkish (TR)
-
Dynamic Page Titles Integrated with vue-i18n and router meta configuration
-
Keyboard Input Support Optimized for fast and accessible gameplay
-
Performance Optimization Custom
useThrottlecomposable for input handling and window resize events
The application is containerized using a multi-stage Dockerfile for optimized production builds.
# Build image
docker build -t sudoku-app .
# Run container
docker run -d -p 8080:80 --name sudoku-container sudoku-appUnit tests are a core part of the development lifecycle and cover domain logic, store behavior, and composables.
# Run unit tests
npm run test
# Run tests with coverage
npm run test:coveragesrc/
├── __tests__/ # Automated test suites (unit & logic)
├── domain/ # Core business rules & entities
├── infrastructure/ # Persistence & external services (LocalStorage)
├── presentation/ # UI Layer
│ ├── components/ # Atomic components (Atoms, Molecules, Organisms)
│ ├── store/ # Pinia state management
│ ├── router/ # Routing with dynamic meta titles
│ ├── language/ # i18n localization files
│ └── utils/ # Global helpers (Config, Throttle)
├── .nvmrc # Node.js version configuration
└── Dockerfile # Containerization setup
- Dynamic Titles: Page titles are synchronized with
vue-i18nand updated automatically viarouter.afterEach. - Global Build Defines:
__APP_VERSION__is injected at build time frompackage.jsonfor full transparency. - Scalability & Extensibility: Grid validation and sub-grid logic are driven by
GRID_CONFIG, enabling easy extensions (e.g., 16x16 Sudoku) and making the codebase backend-ready for remote puzzle fetching.