Articles & tutorials
Deep dives into modern web development — practical guides, hands-on projects and real-world patterns.
37–45 of 47
8 minUltra‑Slim Multi‑Stage Image for SSR: Nuxt 4 + TypeScript + Docker
Build a production‑grade, ultra‑slim Docker image for a Nuxt 4 SSR app using multi‑stage builds, Node 22 LTS, Corepack + pnpm, and Nitro’s node-server preset.
Read article
9 minLocal Hackathon Scoreboard in Containers using Nuxt 4 + TypeScript + Docker
Build a real-time scoreboard for your local hackathon using Nuxt 4 (TypeScript), Server-Sent Events, and Docker with persistent storage.
Read article
11 minNuxt 4 Mapbox: How to Add Interactive Maps with Mapbox GL JS
Learn how to use Mapbox with Nuxt 4. Add interactive Mapbox GL JS maps, markers, popups and GeoJSON layers in a Nuxt 4 + TypeScript app, step by step.
Read article
14 minRealtime Planning Poker with Nuxt 4 + TypeScript + Nitro WebSockets + Pinia
Build a self-hosted realtime app with no third-party backend: Nitro WebSockets for the transport, Nuxt 4 shared types for one contract on both sides, Pinia for derived client state, and useStorage as a swappable persistence seam.
Read article
15 minA Type-Safe Data Layer with Nuxt 4 + TypeScript + Drizzle ORM + SQLite + Zod
Build a Nuxt 4 backend where the database schema is the only source of truth: Drizzle for the tables, drizzle-zod to derive request validators from them, h3 validated handlers at every edge, and Nitro tasks for scheduled background work.
Read article
16 minPasswordless Sign-In with Nuxt 4 + TypeScript + Passkeys (WebAuthn) + Nitro SQL
Ship real passkey authentication on a plain Nuxt 4 server: nuxt-auth-utils for the WebAuthn ceremony, Nitro's built-in db0 SQL layer for users and credentials, sealed cookie sessions, and the rpID gotchas that only appear once you put nginx in front.
Read article
18 minTool-Calling Trip Planner with Nuxt 4 + TypeScript + AI SDK + Mapbox GL JS
Build a Nuxt 4 app where an LLM cannot invent a coordinate: Zod tool schemas in the shared/ folder, Mapbox geocoding and directions running server-side, and a map that redraws itself from the streamed tool results.
Read article
17 minA Non-Blocking Image Editor with Nuxt 4 + TypeScript + Web Workers + Comlink + OffscreenCanvas
Move every pixel of a photo editor off the main thread: a typed Comlink RPC boundary, a canvas handed to a worker with transferControlToOffscreen, frame-coalesced rendering, and a full-resolution export that streams progress back — all SSR-safe inside Nuxt 4.
Read article
19 minA Background Job Queue with Live Progress: Nuxt 4 + TypeScript + Nitro Tasks + Redis + SSE
Get long-running work out of the request/response cycle without adding a second service: a durable queue on unstorage + Redis, a Nitro task that drains it, and Server-Sent Events streaming progress back to the browser — one typed Job shape shared by all three.
Read article