Laravel Vue.js Global Game Development
A GitHub Copilot skill for developing a Laravel + Vue.js multiplayer online game with strict architectural rules, UTC synchronization, anti-cheat measures, and optimized aggregate caching.
What This Skill Does
This skill enforces project-specific development rules for a global multiplayer game built with Laravel and Vue.js. It ensures:
**Vue.js-first architecture** (no Blade templates except system files)**Internationalization** via structured language files**UTC time synchronization** for global consistency**Backend validation** and anti-cheat measures**Aggregate-level caching** for performance optimization**Build command discipline** (no unnecessary rebuilds)Instructions
Core Architecture Rules
**1. Always use Vue.js components**
Write all UI logic in Vue.js with Composition API (`<script setup>`)**Never** create or modify `.blade.php` files (except system Laravel layouts if absolutely necessary)Use reactive state with `ref()`, `reactive()`, and `inject()` for dependencies like `$t` (translations)Organize components logically in `resources/js/components/`Use Composition API patterns and proper lifecycle hooks**2. Always use language files for text**
**Never** hardcode user-facing text in componentsFollow the structure: `resources/lang/{locale}/{section}.php`Access translations via `$t('section.key')` syntaxBefore adding new text, check if translations exist in both `en` and `bg`Add new translation keys to all supported locales (currently English and Bulgarian)Example structure: - `resources/lang/en/home.php` – homepage translations
- `resources/lang/bg/global.php` – global translations
**3. Avoid unnecessary build commands**
**Do not run** `npm run build` or `npm run dev` unless absolutely critical**Do not run** `php artisan serve`These commands run continuously in the background during developmentGlobal Multiplayer Game Rules
**4. UTC time synchronization**
This is a **worldwide online game** – time conflicts are critical**Always use UTC timestamps** for all date/time operations (storage, calculations, comparisons)Store dates in UTC in the databaseConvert to local timezone **only for display** purposes on the frontendEnsure all game events synchronize globally regardless of player location**5. Security and anti-cheating measures**
**Never trust frontend data** – always validate everything on the backendImplement **solid backend checks** for all game operations (actions, records, state changes)Validate, sanitize, and verify **all user inputs** server-side**Never store sensitive game data** on the frontend (e.g., hidden stats, secret mechanics, balances)Use Laravel validation rules and middleware for all routesLog suspicious activity for review**6. Performance and server load optimization**
Always seek the **most optimal and lightweight approach**Minimize database queries – avoid N+1 problems with eager loadingUse **aggregate-level caching** (see below) instead of ad-hoc SUM queriesWrite efficient queries with proper indexingImplement caching strategies (Redis, query caching) where appropriateFocus on fast response times to improve user experienceAvoid unnecessary server strain – optimize computations and reduce redundant operationsAggregate-Level Cache Policy
**7. Use cached aggregates for building-level logic**
The project maintains a per-user, per-object-type cache in the `aggregated_object_levels` tableHelper service: `App\Services\ObjectLevelService`**Always read aggregated values** using: ```php
ObjectLevelService::getCachedAggregateRow($userId, $objectType)
```
Returns: `object_level_sum`, `tool_sum`, `total_level`
If cached row is missing and you need a value immediately, call: ```php
ObjectLevelService::recomputeAndStore($userId, $objectType)
```
But prefer updating cache on change rather than recomputing on reads
**Always update the cached aggregate** after any change to `CityObject` or `Tool` (create/update/delete)For banks specifically, `recomputeAndStore(..., 'bank')` also triggers `MarketService::recomputeUserFee($userId)` to update market fees immediately**Use cached aggregates in scheduled jobs** (population births, mortality, etc.) to avoid expensive repeat SUMsOnly fall back to direct SUM queries when a cache row is missing**Implementation references:**
Aggregator service: `app/Services/ObjectLevelService.php`Cached table: `aggregated_object_levels`Market fee logic: `app/Services/MarketService.php`Update triggers: `ToolController`, `CityController`, `ToolsDecay` command, `PopulationBirths` cron**Recommendation:**
Prefer adding model observers for `Tool` and `CityObject` (created/updated/deleted events)Observers should call `recomputeAndStore` automatically to keep cache correct regardless of code path (controllers, seeds, imports, artisan scripts)Code Quality and Best Practices
**8. Follow existing code styles**
Use **camelCase** for JavaScript/Vue variables and methodsUse **kebab-case** for Vue component file namesAdd comments for complex game logic or non-obvious calculationsUse consistent indentation and formatting (EditorConfig/Prettier)**9. UI/UX consistency**
Use **CoreUI components** for consistent design languageMaintain **responsive design** for all screen sizesAdd appropriate **loading states** during async operationsImplement **error handling** with user-friendly messagesTest language switching and reactivity thoroughly**10. File structure and organization**
Maintain logical file organization: - Vue components: `resources/js/components/`
- Vuex/Pinia stores: `resources/js/stores/`
- Translations: `resources/lang/{locale}/`
- Backend services: `app/Services/`
Use lazy loading for heavy components when necessaryOptimize images and assets before committing**11. Git practices**
Write **meaningful commit messages** describing the "why" and "what"Create separate branches for large features or refactorsKeep commits atomic and focused**12. Testing before finalizing**
Verify changes work correctly in both English and BulgarianTest time-sensitive features with different timezones (but always store UTC)Test anti-cheat measures and backend validationVerify cached aggregates update correctly after model changesExamples
Correct: Using Vue.js with translations
```vue
<template>
<div class="home-page">
<h1>{{ $t('home.welcome') }}</h1>
<p>{{ $t('home.description') }}</p>
</div>
</template>
<script setup>
import { inject } from 'vue'
const $t = inject('$t')
</script>
```
Incorrect: Using Blade template
```php
<!-- ❌ DO NOT DO THIS -->
<div class="home-page">
<h1>Welcome to the Game</h1>
</div>
```
Correct: UTC time handling
```php
// Store UTC timestamp
$event->starts_at = now()->utc();
// Display local time in frontend (Vue component)
const localTime = new Date(event.starts_at).toLocaleString()
```
Correct: Using cached aggregate instead of SUM
```php
// ❌ Avoid this (slow, repeated queries)
$totalLevel = CityObject::where('user_id', $userId)
->where('object_type', 'house')
->sum('object_level');
// ✅ Use this instead
$aggregate = ObjectLevelService::getCachedAggregateRow($userId, 'house');
$totalLevel = $aggregate->total_level;
```
Correct: Updating cache after model change
```php
// After creating/updating a Tool or CityObject
Tool::create([...]);
ObjectLevelService::recomputeAndStore($userId, $objectType);
// Better: use a model observer
// ToolObserver.php
public function created(Tool $tool) {
ObjectLevelService::recomputeAndStore($tool->user_id, $tool->object_type);
}
```
Constraints
**Never** use Blade templates for UI (only system Laravel files if absolutely necessary)**Never** hardcode user-facing text (always use language files)**Never** run `npm run build`, `npm run dev`, or `php artisan serve` unless critical**Never** trust frontend data (always validate on backend)**Never** store sensitive game data on frontend**Always** use UTC for date/time storage and calculations**Always** update aggregate cache after modifying `CityObject` or `Tool` records**Always** validate user inputs server-side**Always** optimize for performance and minimize server loadNotes
This project uses **Laravel** backend with **Vue.js 3** (Composition API) frontendUI framework: **CoreUI**Supported languages: **English (en)** and **Bulgarian (bg)**Game mechanics rely on **UTC synchronization** for global consistencyPerformance is optimized with **aggregate-level caching** (`aggregated_object_levels` table)Anti-cheat measures require **backend validation** for all game actionsConsult these instructions whenever in doubt – they can be updated as the project evolves