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 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!
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