Case Study · Digital Agency
VAN7 Moldova
How I built a fully multilingual digital agency website from scratch — custom internationalisation, interactive UI, and production infrastructure, with no frameworks.
The problem
Moldovan businesses needed professional digital marketing but had no local agency to turn to — only expensive international options with no understanding of the local market or language needs. I founded VAN7 to close that gap, and built the agency's entire web presence myself.
The challenge: serve clients across Moldova's multilingual reality — Romanian, Russian, Ukrainian, and English speakers — with a fast, polished site built without relying on heavy frameworks.
Technical stack
Built with vanilla web technologies by choice — full control over performance and behaviour, zero framework overhead, fast load times even on a single VPS.
HTML5
CSS3 (Grid/Flexbox)
Vanilla JavaScript ES6+
SVG illustrations
Nginx
Cloudflare CDN
VPS (Ubuntu 24)
Python (Pillow)
SSH/SCP deploy
Custom internationalisation system
Built a complete i18n system from scratch — no library, no framework. Translations for English, Russian, Romanian, and Ukrainian live in a single i18n.js file, applied dynamically via data-i18n attributes. Each language lives in its own directory (/ru/, /ro/, /uk/) with language auto-detected from the URL and persisted across navigation.
4 full language versions — every page exists in EN, RU, RO, and UK with independent routing
Instant switching — language changes without page reload, state persists during navigation
Custom SVG flag icons — replaced emoji flags after discovering they don't render correctly on Windows
Site structure
Home
Animated word carousel hero, marquee ticker, stats block, industries section with hover-spotlight, "how we work" cards, CTA banner
Services
Filterable grid of 34+ services across 6 categories with live result counter and category filtering
Partners
Partner case studies with descriptions and outcomes
About
Mission, vision, approach, and team presentation
Interactive UI components
Sticky navbar — blur effect on scroll, responsive hamburger menu, custom language switcher with SVG flags
Cursor spotlight effect — purple glow follows the cursor on service cards and industry blocks, built with CSS custom properties (--mx, --my) and JS mousemove tracking
Scroll animations — IntersectionObserver-driven reveal effects with staggered card animations
Service filtering — vanilla JS category filter with animated show/hide and live result counter, no libraries
Hero word carousel — automatic word rotation using CSS clip-path animation, adapted for varying text lengths across languages
Performance & deployment
All CSS inlined per page to minimise HTTP requests
Image optimisation pipeline using Python/Pillow — background removal with anti-aliased alpha masks, format conversion, compression
Cloudflare CDN for static caching and SSL termination
Manual SSH/SCP deployment pipeline to a self-managed VPS running Nginx
Technical problems I solved
Problem
overflow:hidden broke position:sticky — the main container's overflow-x:hidden silently disabled the sticky navbar. Solved by switching the affected element to fixed positioning.
Problem
Cursor spotlight rendered in the wrong position on load — the default CSS custom property value caused the glow to appear at 50% before the first mouse movement. Fixed by defaulting to an off-screen value instead.
Problem
Emoji flags broke on Windows — flag emoji rendered as plain text ("GB", "RU") on Windows machines. Replaced with inline SVG flags for guaranteed cross-platform rendering.
Problem
i18n race condition — translations occasionally applied before the DOM finished loading. Fixed by checking document.readyState before running the translation pass.