boilerplate-website/README.md
Padreug 0054f3ab80 initial scaffold: vue 3 + vite 8 + shadcn-vue + tailwind 4
Wires pinia, vue-router, vue-i18n, vee-validate/zod, shadcn-vue
(reka-ui), tailwind 4 via @tailwindcss/vite. Sample HomeView
proves i18n + pinia + tailwind. Optional nostr/lnbits feature
folders ship as documentation only — deps install on opt-in.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-05-27 10:05:39 +02:00

3 KiB

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 11src/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).