Toey Sawatdee

UPDATE LOGS

System Active // Data Synced

Next.js SSR Migration & CloudFront Edge Infrastructure

Latest
  • Overview: Completely tore down the legacy static hosting architecture and migrated to a production-grade, containerized Server-Side Rendering (SSR) environment on AWS EC2.
  • Edge Delivery Network: Fronted the EC2 instance with AWS CloudFront CDN to cache static assets globally, drastically reducing origin server load and slashing latency to ~50ms.
  • Backdoor Origin Routing: Engineered a custom DNS topology (`origin.toey-sawatdee.me`) to act as a secure backdoor for CloudFront, bypassing infinite routing loop traps.
  • Reverse Proxy Implementation: Configured Nginx as the primary gatekeeper on the EC2 instance, securely intercepting port 80 traffic and proxying it to the internal Docker network.
  • Global HTTPS Encryption: Enforced strict SSL/TLS encryption across the entire application by attaching an AWS ACM Certificate directly to the CloudFront edge network.
  • Origin Protection: Eliminated direct public IP access to the application container; all public traffic must now pass through CloudFront and Nginx security layers.
  • Zero-Touch Deployment: Engineered a fully automated CI/CD pipeline using GitHub Actions, triggering build, publish, and deployment sequences on main branch merges.
  • Container Orchestration: Integrated GitHub Container Registry (GHCR) and automated remote SSH commands to pull new images and restart containers.
  • Aggressive Image Optimization: Implemented multi-stage Docker builds utilizing Next.js standalone mode, reducing final production image size to under 70MB.
  • Automated Cache Invalidation: Integrated CloudFront cache invalidation (`/*`) directly into the deployment pipeline for real-time content updates.
  • Deprecations: Sunset the legacy AWS S3 static site hosting architecture and removed raw EC2 public IP addresses from primary DNS A Records.

Precision Finance Engine & Universal Morph UI

  • Universal Inline Morph UI: Overhauled all ledgers (Assets, Income, Expenses, Goals) with in-place editing. Rows now "morph" into interactive input fields for rapid data adjustment without context switching.
  • 3-Step Gateway Calculation: Re-engineered the financial math core to handle recurring monthly, exact one-time matches, and month-only yearly cycles with high precision.
  • Embedded Tactical Paginator: Integrated the month-selection paginator directly into ledger rows for date-sensitive records during the editing phase.
  • Radar Lock Sync Protocol: Deployed a dynamic sync sensor in the HUD that flags out-of-period browsing in Amber and allows instant re-sync with a single click.
  • Multi-Phase Validation Engine: Implemented a robust security layer for data entry: The Ghost Trap (empty labels), The NaN Trap (invalid numbers), and The Negative Asset Trap (logical balance enforcement).
  • Zustand Partial Update Engine: Optimized the state store with surgical update actions (`updateAsset`, `updateIncome`, etc.) for high-performance data mutations.
  • Operational Safety Overhaul: Implemented global deletion protocols with confirmation safeguards and always-visible destruction triggers.

Tactical Finance Tracker & HUD System Integration

  • The Vault (Zustand Store): Implemented a high-performance finance engine with LocalStorage persistence and data versioning (V1) for long-term data integrity.
  • Financial Math Engine: Engineered real-time calculation logic for the 50/30/20 rule, Emergency Runways, and automated Sinking Fund distributions.
  • S.M.A.R.T Goal Architecture: Launched a goal-tracking system with "Lock-in" fund allocation, preventing double-counting of liquid assets and enforcing financial discipline.
  • Tactical HUD Header: Deployed a dynamic `HudHeader` system across all routes, providing contextual titles and navigational orientation.
  • Multi-Currency Protocol: Integrated full support for THB, AUD, USD, and EUR, localized via `Intl.NumberFormat`.
  • Administrative Structural Refactor: Migrated game server dashboards to a secure `/admin` scope and optimized sidebar navigation for authenticated sessions.
  • Hydration & Reliability: Eliminated flickering in stateful dashboard components by implementing a deterministic hydration strategy for persistent store data.

Blueprint Design System & Technical Aesthetics Overhaul

  • The Blueprint Grid: Migrated from solid backgrounds to a 24px precision graph-paper grid across all application routes.
  • Tracing Paper Cards: Implemented semi-translucent (`bg-white/80`) cards with backdrop-blur, allowing background grid lines to bleed through for a premium layered feel.
  • The Ink Palette: Replaced generic colors with a professional "Ink & Paper" palette (Slate-800/300) and Indigo-600 (Printer Blue) accents.
  • Monospace Dominance: Enforced `font-mono` across all metrics, latency values, and technical IDs to emphasize data precision.
  • Sharp Edge Architecture: Purged all shadows and consumer-grade rounded corners, adopting a ruler-sharp `rounded-sm` design system.
  • Micro-Interactions: Engineered a "Radar Pulse" (`animate-radar-ping`) for live status indicators, providing visual feedback of heartbeat synchronization.

Observability & Professional Dashboard Rebranding

  • System Status Page: Launched an enterprise-grade `/status` page with real-time infrastructure health monitoring.
  • Live Health Checks: Integrated authentic status tracking for AWS Cognito (via OIDC config) and CloudFront (via local asset verification).
  • Zero-Cost Latency Tracking: Implemented API latency monitoring using `OPTIONS` preflight requests to avoid unnecessary Lambda invocations and visitor counter increments.
  • Eradicated Layout Shift (CLS): Refactored Zomboid and Status components to eliminate "Black Hole" hydration flickering by ensuring deterministic SSR states.
  • Technical Rebranding: Purged marketing buzzwords across the site, replacing them with architectural trade-offs and engineering metrics.
  • Admin Log: Renamed "Server Status" to "Admin Log" and standardized the internal dashboard interface.

Zomboid Serverless Infrastructure & Guardian Agent (v2.0)

  • AWS Architecture & Backend: Corrected the Lambda function runtime mismatch (Node.js -> Python 3.12) and fixed the hardcoded AWS Region bug (ap-southeast-2).
  • CORS & Security: Fixed the double-header trap, properly configured AWS HTTP API CORS settings, and removed a useless API Gateway Authorizer blocking the public API.
  • DynamoDB Decimal Serialization: Implemented a custom DecimalEncoder in Python to prevent JSON parsing crashes.
  • The Guardian Agent: Completely rewrote the game server polling script with stateful memory tracking (Peak Players, Total Ping, Uptime).
  • Graceful Shutdown: Added SIGINT and SIGTERM signal listeners to push a final OFFLINE payload to AWS before dying, preventing "Ghost Online" statuses.
  • Direct File System Parsing: Bypassed GameDig limitations by directly reading the Zomboid servertest.ini configuration file to extract and push the active ModsList.
  • Frontend React Hydration Fix: Implemented an isMounted state to prevent server/client rendering mismatches caused by dynamic timestamps.
  • Offline Flex Dashboard: Revamped the UI logic to dynamically shift and show an AWS Serverless Architecture Diagram alongside Last Session Historical Stats during downtime.
  • Eradicated Ghost Data Bugs: Forced conditional rendering to cleanly display 0/0 and 0 ms when the server is down.

Zomboid Dashboard Redesign & Stability

  • Redesigned ZomboidStatus component to always display all stat fields (Map, Players, Ping, Last Update) even when the server is offline — showing zero / placeholder values.
  • Refactored Zomboid API route with graceful offline defaults so the page never renders an error state.
  • Aligned the Zomboid page to the project design system (white cards, Material Symbols icons, consistent spacing).
  • Converted all Thai text and comments to English across the Zomboid module for codebase consistency.
  • Added an offline hint banner explaining auto-refresh behavior to visitors.

Project Zomboid Server Integration

  • Integrated real-time Project Zomboid Server Dashboard into the public view.
  • Developed backend API polling leveraging the gamedig library.
  • Refactored ZomboidStatus component for centralized server monitoring.

Architectural Refactoring & UI Overhaul

  • Transitioned to a unified Light Theme and modernized the typography using the Inter font.
  • Engineered a Mobile-First Sidebar with an interactive slide-over menu and backdrop blur.
  • Implemented an Isolated Login Route with Auth Guard and Callback URLs.

Initial Infrastructure Deployment

  • Configured AWS S3 and CloudFront for global static asset delivery.
  • Integrated AWS Cognito User Pools for administrator access control.
  • Established automated CI/CD pipelines via GitHub Actions.