Basic SvelteKit Template

Everything you need to build a Full-Stack Svelte project.

The Stack

• sveltekit full-stack framework
• vercel for hosting
• tailwindcss utility-first CSS framework
• shadcn-svelte component library
• paraglide-sveltekit for localization
• sveltekit-flash-message for flash messages
• securekit for protecting from XSS attacks
• prisma type-safe database ORM
• lucia for session authentication
• eslint for linting
• prettier for formatting
• vitest for unit testing

Developing

Generate Prisma Client and DB Migration

Run the following command to generate prisma client from your schema:

bun run db:gen

To run the migration use bun run db:mig:

bun run db:mig dev --name <migration-name>

Add Headless UI Components

Run the following command to add Shadcn UI components:

bun run ui add <component-name>

# Example: add button and input
bun run ui add button input

Start Dev Server

Once you've created a project and installed dependencies with bun install (or pnpm or yarn), start a development server:

bun run dev

# or start the server and open the app in a new browser tab
bun run dev -- --open

Building

To create a production version of your app:

bun run build

You can preview the production build with bun run preview.