Nuxt.js is my framework of choice for high‑performance, SEO‑friendly frontends with Vue.
Whether classic website, headless storefront or large web app: Nuxt combines DX, performance and flexibility (SSR/SSG/ISR) in a solid toolkit.
Why Nuxt?
Nuxt adds everything modern web projects need:
- Rendering modes: SSR, SSG and ISR — matched to SEO, speed and scale.
- File‑based structure: Routing, layouts, middleware, server APIs — clear and maintainable.
- Nitro server: Server functions/endpoints (
/server/api/*
) without a separate backend, adapters for Node/Serverless/Edge. - DX‑focused: TypeScript, Vite, auto‑imports, composables, modular ecosystem.
Architecture & best practices
- Pages & layouts: Clean IA with global and per‑page layouts.
- Composables: Shared logic (data fetching, formatting, state) in
/composables
. - Server APIs: Lightweight BFF layer for auth, proxying, normalisation.
- Data fetching:
useAsyncData()
/useFetch()
with caching, error and loading states. - Middleware: Access control, feature flags, A/B routing.
- State: Pinia for typed global state (users, cart, permissions).
Performance & SEO
- SSR/SSG/ISR for fast TTFB and indexable content.
- Code‑splitting & lazy loading to minimise bundles.
- Image optimisation with
@nuxt/image
. - Meta/OG/Twitter via
useSeoMeta()
and head management. - Route rules & caching: Fine‑grained control (SWR, headers).
Internationalisation (i18n)
- nuxt‑i18n with a clean URL strategy (
/de
,/en
,/ru
), keys, fallbacks. - Locale‑specific SEO (hreflang), date/number formatting, currency display.
- Integrated in routing, middleware and head tags.
Headless & integrations
- Shopware 6: Catalogue, cart, checkout, CMS mapping.
- WordPress (REST/GraphQL): Blog/pages as headless source.
- Laravel backends: Auth, policies/permissions, jobs/queues — Nuxt as the frontend layer.
- Third‑party APIs: DeepL, payments, ERP/PIM, search.
Security
- Auth flows: Session/JWT, CSRF, refresh tokens, HTTP‑only cookies.
- Headers & policies: CSP, HSTS, SRI, referrer policy.
- Rate limiting & bot protection on Nitro endpoints.
- Input validation & sanitising on server and client.
Quality, tests & CI/CD
- TypeScript‑first, ESLint, Prettier.
- Unit/Component tests (Vitest) & E2E (Playwright/Cypress).
- CI pipelines (build, lint, test, previews), preview links for reviews.
- Observability: Logging, Sentry, Web‑Vitals, RUM.
Services with Nuxt
- Architecture (SSR/SSG/ISR, SEO, i18n, security).
- Implementation of components, pages, routes, middleware, server APIs.
- Headless frontends for Shopware/WordPress/Laravel incl. auth and data model.
- Performance tuning (bundle analysis, caching, image pipelines, edge).
- Migrations (SPA → Nuxt, legacy → modern), refactoring & coaching.
Example projects
- Headless storefront (Shopware 6 + Nuxt)
Listing, search, PDP, cart/checkout, account; SSR + image optimisation; i18n/multi‑currency. - Content hub (WordPress headless + Nuxt)
Blog/pages via REST, SSG + ISR, SEO rich snippets, editorial workflows. - SaaS dashboard (Laravel API + Nuxt)
Auth/permissions, real‑time KPIs, uploads, queue status, granular caches.
Modules & tools I often use
- nuxt‑i18n, @nuxt/image, @nuxt/content, @pinia/nuxt
- UI libraries (Nuxt UI / Tailwind)
- Security/Headers, Sentry, Unhead
- Vite plugins (analyser, legacy, compression)
Deployment & hosting
- Node adapter (Docker/K8s), serverless/edge (Vercel/Netlify) via Nitro adapters.
- CDN integration (caching, ISR, images), zero‑downtime deployments.
- Env management & secrets, staging/preview environments.
Conclusion
With Nuxt I build fast, secure and scalable frontends — ideal for SEO‑focused sites, headless shops and enterprise web apps.