Files
nuxt-boilerplate/README.md
T

2.1 KiB

Nuxt Boilerplate

Starter for the Nuxt coursework workspace: Bun + Nuxt + TypeScript + Tailwind, with MySQL (Drizzle ORM) and Redis wired up to the shared course databases.

Development

bun install
bun run db:push   # creates the `notes` table from server/db/schema.ts
bun run dev

Open http://localhost:3000 - the home page shows a small notes list (MySQL) and a key/value box (Redis) so you can see both connections working.

What's here

  • app/pages/index.vue - example page using <template lang="pug">, calling the API routes below via useFetch/$fetch. Delete once you understand the pattern and start building your own pages.
  • server/api/notes.get.ts / notes.post.ts - example MySQL reads/writes via Drizzle.
  • server/api/cache/[key].get.ts / [key].put.ts - example Redis reads/writes.
  • server/db/schema.ts - your Drizzle table definitions. Add tables here, then run bun run db:push to sync them to MySQL (no migration files needed for coursework - push just diffs your schema against the live database).
  • server/db/index.ts / server/utils/redis.ts - pre-configured clients, reading connection details from environment variables. In your Coder workspace these are already set for you (MYSQL_*, REDIS_*) - you never need to type a password into code.
  • .env.example - only needed if you want to run this outside your Coder workspace, against your own local MySQL/Redis.
  • .gitea/workflows/deploy.yml - deploys to Vercel on push to main, but only if you've set VERCEL_TOKEN (and VERCEL_ORG_ID/VERCEL_PROJECT_ID) as repo secrets. Without them the job is skipped - nothing breaks.

Notes

  • Your Redis user can only touch keys under student:<your-username>:* (enforced by the server) - that's why the cache routes prefix keys with REDIS_USERNAME. Keys outside that prefix will be rejected.
  • Your MySQL user only has access to your own database - no need to specify it beyond what's already in MYSQL_DATABASE.
  • Tailwind classes are available everywhere via @nuxtjs/tailwindcss - no extra CSS file needed for basic usage.