xmuu.my.id
← All projects

xmuu-dev — personal platform

Next.js 16TypeScript 7Tailwind v4next-intlTurborepo
Repository

Context

A typical portfolio stops at being a brochure: a static page showcasing the past. I wanted the opposite — a site that is the working proof: alive, growing, with every decision traceable. Hence the personal platform plan: portfolio + interactive technical writing + dev tools in one modular system.

Goals

  • Technical posts with interactive diagrams & simulations — backend concepts should be played with, not just read
  • Two languages (id/en) on one content engine, without a CMS
  • An architecture that accepts a new module in hours: an ansible generator, monitoring, a social pipeline, an AI lab
  • Deployable on a single VPS that (later) gets provisioned by this platform's own ansible generator

Architecture

A modular monolith: one Next.js app with a thin kernel and modules attaching through validated manifests.

| Layer | Decision | Short reason | |---|---|---| | Framework | Next.js 16 (App Router) | Static content + interactive dashboard in one app | | Content | MDX in git + content-collections | Interactive posts = React components; git = one PR for prose+code+assets | | Bilingual | next-intl, root = id, /en for English | One URL per language, correct hreflang, no CMS | | Monorepo | pnpm + Turborepo | apps/web + packages/kernel + later apps/worker | | Kernel | module registry first; DB/auth/queue per phase | Built by the pull of real modules, not speculation |

Deliberate trade-offs

No CMS — a GUI editor arrives later as a dashboard layer writing commits, not replacing git. No DB in phase one — content is files; Postgres arrives with the module that needs it (the generator, phase two). One end-to-end language — in the agent era, 2026 research shows verification becoming the bottleneck; one language means one verification surface, and its CI gates are installed from the first commit.

Phases

  1. Portfolio + posts (running) — bilingual content engine, monochrome theme, module registry
  2. Ansible bundle generator — brings the first Postgres + auth
  3. Social asset pipeline & queue — brings workers + object storage
  4. AI lab & monitoring
  5. Per-platform publish API integrations

Status and process notes are written directly in the blog posts — because this platform is itself the flagship project.