Build a SvelteKit SaaS with Auth and Payments

npx sv create my-saas --template minimal --types ts --no-add-ons --install npm
cd my-saas || exit 1
npx sv add 'tailwindcss=plugins:none' --install npm
npm install drizzle-orm pg stripe @node-rs/argon2
npm install -D drizzle-kit @types/pg

// src/env.ts
import { defineEnvVars } from '@sveltejs/kit/env';

export const variables = defineEnvVars({
	DATABASE_URL: {}, APP_URL: {}, STRIPE_SECRET_KEY: {},
	STRIPE_WEBHOOK_SECRET: {}, STRIPE_PRO_PRICE_ID: {}
});

// src/lib/server/db/schema.ts
import { pgTable, text, timestamp } from 'drizzle-orm/pg-core';

export const users = pgTable('app_user', {
	id: text('id').primaryKey(),
	email: text('email').notNull().unique(),
	name: text('name').notNull(),
	passwordHash: text('password_hash').notNull(),
	plan: text('plan').notNull().default('free'),
	stripeCustomerId: text('stripe_customer_id'),
	stripeSubscriptionId: text('stripe_subscription_id')
});

export const sessions = pgTable('session', {
	id: text('id').primaryKey(), // SHA-256 of the cookie token, never the token itself
	userId: text('user_id').notNull().references(() => users.id),
	expiresAt: timestamp('expires_at', { withTimezone: true }).notNull()
});

// src/lib/server/auth.ts
import { createHash, randomBytes } from 'node:crypto';
import { eq } from 'drizzle-orm';
import type { Cookies } from '@sveltejs/kit';
import { db } from './db/index.js';
import { sessions, users } from './db/schema.js';

const DAY = 24 * 60 * 60 * 1000;
const COOKIE = 'session';
const hashToken = (token: string) => createHash('sha256').update(token).digest('hex');

export async function createSession(userId: string, cookies: Cookies) {
	const token = randomBytes(24).toString('base64url');
	const expiresAt = new Date(Date.now() + 30 * DAY);
	await db.insert(sessions).values({ id: hashToken(token), userId, expiresAt });
	setCookie(cookies, token, expiresAt);
}

export async function validateSession(token: string) {
	const id = hashToken(token);
	const [row] = await db
		.select({ session: sessions, user: users })
		.from(sessions)
		.innerJoin(users, eq(sessions.userId, users.id))
		.where(eq(sessions.id, id));
	if (!row) return null;
	if (row.session.expiresAt.getTime() <= Date.now()) {
		await db.delete(sessions).where(eq(sessions.id, id));
		return null;
	}
	const { id: userId, email, name, plan } = row.user;
	return { user: { id: userId, email, name, plan } };
}

export async function invalidateSession(token: string) {
	await db.delete(sessions).where(eq(sessions.id, hashToken(token)));
}

export function setCookie(cookies: Cookies, token: string, expires: Date) {
	cookies.set(COOKIE, token, { path: '/', httpOnly: true, sameSite: 'lax', secure: true, expires });
}
export const getToken = (cookies: Cookies) => cookies.get(COOKIE);
export const clearCookie = (cookies: Cookies) => cookies.delete(COOKIE, { path: '/' });

// src/hooks.server.ts
import type { Handle } from '@sveltejs/kit/hooks';
import { clearCookie, getToken, validateSession } from '#lib/server/auth.js';

export const handle: Handle = async ({ event, resolve }) => {
	event.locals.user = null;
	const token = getToken(event.cookies);
	const result = token ? await validateSession(token) : null;
	if (result) event.locals.user = result.user;
	else if (token) clearCookie(event.cookies);
	return resolve(event);
};

// src/routes/login/+page.server.ts
import { fail, redirect } from '@sveltejs/kit';
import { verify } from '@node-rs/argon2';
import { eq } from 'drizzle-orm';
import { createSession } from '#lib/server/auth.js';
import { db } from '#lib/server/db/index.js';
import { users } from '#lib/server/db/schema.js';
import type { Actions } from './$types';

export const actions: Actions = {
	login: async ({ request, cookies }) => {
		const data = await request.formData();
		const email = String(data.get('email') ?? '').trim().toLowerCase();
		const password = String(data.get('password') ?? '');
		const [user] = await db.select().from(users).where(eq(users.email, email));
		if (!user || !(await verify(user.passwordHash, password))) {
			return fail(400, { error: 'Invalid email or password' });
		}
		await createSession(user.id, cookies);
		redirect(303, '/dashboard');
	}
};

// src/routes/dashboard/+layout.server.ts
import { redirect } from '@sveltejs/kit';
import type { LayoutServerLoad } from './$types';
export const load: LayoutServerLoad = async ({ locals }) => {
	if (!locals.user) redirect(303, '/login');
	return { user: locals.user };
};

// src/routes/dashboard/billing/+page.server.ts
import { fail, redirect } from '@sveltejs/kit';
import { APP_URL, STRIPE_PRO_PRICE_ID } from '$app/env/private';
import { eq } from 'drizzle-orm';
import { db } from '#lib/server/db/index.js';
import { users } from '#lib/server/db/schema.js';
import { stripe } from '#lib/server/stripe.js';
import type { Actions, PageServerLoad } from './$types';

const getUser = async (id: string) => (await db.select().from(users).where(eq(users.id, id)))[0];

export const load: PageServerLoad = async ({ locals }) => {
	if (!locals.user) redirect(303, '/login');
	return { plan: (await getUser(locals.user.id)).plan };
};

export const actions: Actions = {
	upgrade: async ({ locals }) => {
		if (!locals.user) return fail(401);
		const user = await getUser(locals.user.id);
		let customerId = user.stripeCustomerId;
		if (!customerId) {
			customerId = (await stripe.customers.create({ email: user.email, name: user.name })).id;
			await db.update(users).set({ stripeCustomerId: customerId }).where(eq(users.id, user.id));
		}
		const session = await stripe.checkout.sessions.create({
			customer: customerId,
			mode: 'subscription',
			line_items: [{ price: STRIPE_PRO_PRICE_ID, quantity: 1 }],
			client_reference_id: user.id,
			success_url: `${APP_URL}/dashboard/billing?success=true`,
			cancel_url: `${APP_URL}/dashboard/billing`
		});
		redirect(303, session.url!);
	},

	portal: async ({ locals }) => {
		if (!locals.user) return fail(401);
		const { stripeCustomerId } = await getUser(locals.user.id);
		if (!stripeCustomerId) return fail(400);
		const portal = await stripe.billingPortal.sessions.create({
			customer: stripeCustomerId,
			return_url: `${APP_URL}/dashboard/billing`
		});
		redirect(303, portal.url);
	}
};

// src/routes/api/stripe/webhook/+server.ts
import { error } from '@sveltejs/kit';
import { STRIPE_WEBHOOK_SECRET } from '$app/env/private';
import { eq } from 'drizzle-orm';
import { db } from '#lib/server/db/index.js';
import { users } from '#lib/server/db/schema.js';
import { stripe } from '#lib/server/stripe.js';
import type { RequestHandler } from './$types';

export const POST: RequestHandler = async ({ request }) => {
	const body = await request.text(); // raw bytes: never request.json()
	let event;
	try {
		event = stripe.webhooks.constructEvent(body, request.headers.get('stripe-signature') ?? '', STRIPE_WEBHOOK_SECRET);
	} catch {
		error(400, 'Invalid signature');
	}

	if (event.type === 'checkout.session.completed') {
		const s = event.data.object;
		if (s.mode === 'subscription' && s.client_reference_id) {
			await db.update(users)
				.set({ plan: 'pro', stripeCustomerId: s.customer as string, stripeSubscriptionId: s.subscription as string })
				.where(eq(users.id, s.client_reference_id));
		}
	} else if (event.type === 'customer.subscription.deleted') {
		await db.update(users)
			.set({ plan: 'free', stripeSubscriptionId: null })
			.where(eq(users.stripeSubscriptionId, event.data.object.id));
	}
	return Response.json({ received: true });
};