boilerplate-website

Opinionated Vue 3 starter — the base every new aiolabs website forks from.

Stack

• Vue 3.5 + Vite 8 + TypeScript 6
• shadcn-vue (via reka-ui + class-variance-authority + tailwind-merge) — components.json pre-wired, run pnpm dlx shadcn-vue@latest add <name> to copy components in
• Tailwind CSS 4 (via @tailwindcss/vite — no tailwind.config.js)
• Pinia 3 — sample useCounterStore in src/stores/
• Vue Router 5 — file in src/router/index.ts, lazy-loaded views in src/views/
• Vue I18n 11 — src/i18n/locales/{en,es}.json
• vee-validate 4 + zod 3 — form validation primitives (zod pinned to ^3 until @vee-validate/zod ships a v4-compatible resolver)
• @lucide/vue — icon set (lucide-vue-next is deprecated upstream)
• ESLint 10 (flat config) + Prettier 3

Quick start

pnpm install
pnpm dev          # vite dev server
pnpm build        # type-check + production build
pnpm preview      # serve dist/
pnpm lint
pnpm format

Layout

src/
├─ App.vue              # router-view shell
├─ main.ts              # plugin wiring
├─ style.css            # tailwind + shadcn-vue CSS variables
├─ lib/utils.ts         # cn() — shadcn-vue's class merger
├─ router/index.ts
├─ stores/counter.ts    # example pinia store
├─ i18n/
│  ├─ index.ts
│  └─ locales/{en,es}.json
├─ views/HomeView.vue   # proof-of-wiring page (i18n + pinia + tailwind)
└─ features/
   ├─ nostr/README.md   # opt-in: nostr-tools wiring (see file)
   └─ lnbits/README.md  # opt-in: LNbits payments wiring (see file)

Optional features

Both nostr and LNbits live as documentation-only folders. The deps aren't installed by default — bundle stays small for sites that don't need them. Each folder's README walks you through enabling.

• src/features/nostr/ — connect to relays, sign/publish events, contact forms that DM the site owner's npub
• src/features/lnbits/ — create invoices, accept Lightning payments via an LNbits instance

Versioning strategy

The boilerplate's main branch is the "tools wired, no content" baseline. New site = clone (or fork on Forgejo) → start adding content immediately.

To pull dep refreshes from the boilerplate into an existing site:

git remote add boilerplate forgejo@git.atitlan.io:aiolabs/boilerplate-website.git
git fetch boilerplate
git merge boilerplate/main

When a site diverges enough to no longer benefit from these merges, drop the remote — it becomes its own thing.

Keeping deps current

• The boilerplate gets dep bumps via PRs (Renovate / Dependabot configurable; otherwise periodic pnpm update --latest + manual review).
• The Vue ecosystem (vue, pinia, router, i18n, vee-validate) versions in lockstep — when one majors, the others usually follow within weeks.
• Tailwind 4 + shadcn-vue + reka-ui is the current modern combo. shadcn-vue uses tw-animate-css (not the deprecated tailwindcss-animate plugin).