devHaitham481 / kit-saas-starter

A starter template for modern SaaS apps with SvelteKit

Home Page:https://kit-saas-starter.pages.dev

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

SvelteKit SaaS Starter

Made with SvelteKit Made with TypeScript Made with Tailwind License MIT

🚧 This project is still under development. 🚧

Introduction

Bootstrap your next SaaS project with this SvelteKit template. πŸš€

🌍 Live: https://kit-saas-starter.pages.dev/

Entirely hosted on Cloudflare. Why?

  1. They have a generous free tier. For real.
  2. Deploying is really easy and they have a great support.
  3. A lot of built-in tools, like D1 (database), R2 (storage), cache, DNS ecc.
  4. It's easy to get out, if you want, because egress costs are the lowest among the competitors.

Features

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

How to use

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

Testing

Install Playwright testing tools with

pnpm exec playwright install

Run

pnpm test

Deploy

Just migrate schema to production database

pnpm drizzle:push:prod

About

A starter template for modern SaaS apps with SvelteKit

https://kit-saas-starter.pages.dev

License:MIT License


Languages

Language:Svelte 53.6%Language:TypeScript 43.5%Language:JavaScript 1.4%Language:HTML 0.9%Language:CSS 0.5%