Bootstrap your next SaaS project with this SvelteKit template. 🚀
🌍 Live: https://kit-saas-starter.pages.dev/
Entirely hosted on Cloudflare. Why?
- They have a generous free tier. For real.
- Deploying is really easy and they have a great support.
- A lot of built-in tools, like D1 (database), R2 (storage), cache, DNS, Analytics, Captcha ecc.
- It's easy to get out, if you want, because egress costs are the lowest among the competitors.
❤️ SvelteKit - Full stack JS meta framework
🪶 Drizzle ORM - Next gen, lightweight TypeScript ORM.
🛆 Lucia - A fully typed auth library
💅🏻 Tailwind CSS + Bits UI + shadcn-svelte - For styling
⚡ formsnap + sveltekit-superforms + zod = Amazing forms
🌀 lucide - Beautiful and simple icons
🌲 pino - Logging for client and server side
🪂 Paraglide JS - i18n
🔄 @total-typescript/ts-reset - A 'CSS reset' for TypeScript, improving types for common JavaScript API's
🛣️ vite-plugin-kit-routes - Fully typed routes!
📊 Cloudflare Web Analytics - Analytics
🛡️ Cloudflare Turnstile - Free CAPTCHA Alternative
💳 Stripe - Payments
Warning
This section is not updated.
Clone this repo with
pnpm dlx degit --mode=git yverek/kit-saas-starter my-project
cd my-project
pnpm install
cp wrangler.example.toml wrangler.toml
Go to Cloudflare and deploy this project.
Log in with your Cloudflare account by running:
pnpm exec wrangler login
Now create your D1 database with
$ pnpm exec wrangler d1 create my-db-prod
✅ Successfully created DB "my-db-prod"
[[d1_databases]]
binding = "DB"
database_name = "my-db-prod"
database_id = "<unique-ID-for-your-database>"
Go to wrangler.toml
and change database_name
and database_id
.
Go to drizzle.config.ts
and change dbName
.
Go to package.json
and change dbName in drizzle:push:dev
and drizzle:push:prod
.
pnpm drizzle:push:dev
Now, you can run
pnpm dev
# or start the server and open the app in a new browser tab
pnpm dev -- --open
Install Playwright testing tools with
pnpm exec playwright install
Run
pnpm test
Just migrate schema to production database
pnpm drizzle:push:prod