Vue i18n frontend project

A lightweight frontend built from the same components as the larger applications here, minus the backend. It earns a note as the lower bound of the pattern: the point where the full typed-contract stack stops being worth its own weight.

The stack

Vue 3 with Vite for the build, Vuetify for components, and vue-i18n for multilingual content. No API layer, no database, no migrations.

The judgment it represents

The full stack — generated clients, Alembic migrations, PostgreSQL, a proxy — solves problems that appear when a frontend and backend evolve separately and can disagree. If there is no backend, none of those problems exist, and adopting the machinery anyway means paying its cost for nothing.

I find this easy to get wrong in the direction of too much structure. Having a pattern that works creates a pull toward applying it everywhere, and the cost of over-structuring a small project is invisible at the start and obvious a year later, when a static site requires a database to be running before it will build.

What still carried over

• Vite for the build. Fast enough that the development loop stays tight, and the configuration is small.
• Vuetify for components. Consistency for free, and the decision not to design a component system is worth making explicitly rather than by default.
• TypeScript throughout, even without an API contract to enforce. The value here is refactoring confidence rather than contract safety, which is a smaller benefit but not zero.

On internationalisation

vue-i18n slots in without changing the component model — strings move to locale files and components reference keys. The part that is not free is that translation is a content workflow, not a code one. Someone has to maintain the locale files, and if that person is not a developer the repository is the wrong place for them to work.

Retrofitting i18n is considerably worse than starting with it, because every hard-coded string has to be found. Adding it up front costs almost nothing.

See also: Vue 3, Vite, the devenv content site for a similarly small project, and the web architecture map.