Case study

mkdev.vip — from interface to server and releases

mkdev.vip is this website: a bilingual portfolio, a catalog of my own products and the MK • AI assistant. I built all of it, from design and frontend to backend and infrastructure: Next.js 16, React 19 and TypeScript on my own VPS behind nginx, SQLite storage, verified releases with automatic rollback and 300+ automated tests.

  1. Task

    Build a site that demonstrates my approach by itself.

  2. Solution

    The site, the server and the release process are built as one product: Next.js 16, React 19 and TypeScript on my own VPS.

  3. Result

    The site runs on my own server and updates with a single command.

mkdev.vip first screen (Russian version): navigation, portrait and the “Full-stack developer” heading
mkdev.vip first screen (Russian version) at 1440 px wide.

What needed solving

Build a site that demonstrates my approach by itself: two complete language versions, live 3D graphics and an AI assistant, on my own server that can be updated safely without putting data at risk.

How it works

The site, the server and the release process are built as one product: Next.js 16, React 19 and TypeScript on my own VPS. A single dynamic route serves the Russian and English versions, and the 3D mark is rendered in WebGL with Three.js. Node.js 22 runs behind nginx as a locked-down systemd service, with data stored in SQLite. MK • AI accepts voice input and files, and its costs are capped by per-user limits and a monthly budget.

Product capabilities

Two languages

  • Russian and English versions with their own URLs, canonical links and hreflang.
  • An automated check renders every page in both languages: one H1, unique ids and working internal links.

Interface and graphics

  • A silver 3D mark rendered in WebGL with Three.js.
  • Responsive layouts that respect prefers-reduced-motion.

MK • AI

  • Voice input and analysis of uploaded files.
  • Per-user per-minute and daily limits plus a monthly spending budget.
  • A private admin area excluded from indexing.

Security

  • Security headers: Content Security Policy, HSTS, X-Frame-Options and Referrer-Policy.
  • nginx rate limiting for the API and the admin sign-in.
  • A systemd service under a dedicated user: NoNewPrivileges, ProtectSystem=strict and memory caps.

Releases

  • Release packages are scanned for secrets and ship with SHA-256 checksums.
  • A backup before every update and an atomic version switch.
  • Post-deploy checks of pages and headers, with automatic rollback on failure.

Tests

  • 300+ automated tests on the built-in Node.js test runner.
  • Separate tests for the deployment and server maintenance scripts.

What was delivered

The site runs on my own server and updates with a single command: the release package is scanned for secrets and ships with SHA-256 checksums, the version switch is atomic, pages and security headers are checked after deployment, and the previous release comes back automatically on failure. More than 300 automated tests cover pages, data and server logic.

Engineering decisions

  • A single App Router dynamic route serves both languages and rejects unknown paths.
  • SQLite through the built-in node:sqlite module, with no separate database server.
  • The MK • AI budget is reserved before each request and settled against actual usage.
  • schema.org structured data and a dedicated Open Graph image for every case study.
  • Old hashed chunks are kept during updates so tabs opened earlier keep working.
  • Before a release switch the script checks archive integrity, free disk space and that no AI request is in progress.