techniq/sveltekit-drizzle

Experimenting with SvelteKit, Drizzle ORM, Lucia, Superforms, and more

New Tech Stack

• SvelteKit
• Drizzle ORM
  • Zod integration
• Lucia
  • Drizzle integration
• Superforms
  • Client and server-side validation
  • SvelteKit actions, works without javascript
  • Zod integration
• Zod
• Postgres (Neon)
• Redis (Upstash)
• Storage (Cloudflare R2)

Setup SvelteKit / Vercel

• Tutorial — SvelteKit and Drizzle-ORM
• vercel login
• vercel link
• verecel git connect

Run server

• vercel env pull .env.development.local
  • Pull any changes added to vercel environment variables
  • Setup DATABASE_URL if needed
• npm run dev

Drizzle

• Quick start
• Migrations
• drizzle-zod

Update model

• Update schema.ts
• npm run migrate
• npm run migrate:apply or run generated SQL scripts (lists in console, or view drizzle directory)

Lucia

• API
• SvelteKit
• Database Schema
• OAuth / Github

Superforms

Environment Variables

Current variables defined using Vercel dashboard (setting up Vercel Postgres or Vercel Neon integration)

console.log({
	// Vercel
	POSTGRES_URL: env.POSTGRES_URL,
	POSTGRES_HOST: env.POSTGRES_HOST,
	POSTGRES_USER: env.POSTGRES_USER,
	POSTGRES_PASSWORD: env.POSTGRES_PASSWORD,
	POSTGRES_DATABASE: env.POSTGRES_DATABASE,

	// Neon
	DATABASE_URL: env.DATABASE_URL,
	PGHOST: env.PGHOST,
	PGUSER: env.PGUSER,
	PGPASSWORD: env.PGPASSWORD,
	PGDATABASE: env.PGDATABASE
});

Hosting

• Vercel (web)
• Neon (Postgres)
• Upstash (Redis)
• Cloudflare (R2)