template--bun-hono-sveltekit Svelte Themes

Template Bun Hono Sveltekit

Bun + SvelteKit + Hono + Prisma Template

A modern, full-stack monorepo template featuring Bun as the runtime, SvelteKit for the frontend, Hono for type-safe APIs, Prisma for database access, and Tailwind CSS for styling.

Dev Quickstart

Install deps, start dev docker db, push schema to dev db, run web app dev server.

bun i
bun run docker:up
bun run db:push
bun run dev

✨ Features

  • ⚔ Bun — Fast JavaScript runtime & package manager
  • šŸŽØ SvelteKit 2 — Full-stack Svelte framework with SSR
  • šŸ”„ Hono — Lightweight, type-safe API framework
  • šŸ—ƒļø Prisma — Type-safe database ORM with PostgreSQL
  • šŸ’Ø Tailwind CSS v4 — Utility-first CSS framework
  • 🐳 Docker Compose — One-command local development setup
  • šŸ“¦ Monorepo — Organized workspace structure

šŸ“ Project Structure

ā”œā”€ā”€ app/                    # SvelteKit application
│   └── src/
│       └── routes/
│           └── api/[...paths]/  # Hono API mount point
ā”œā”€ā”€ pkg/
│   ā”œā”€ā”€ api/               # Hono API package
│   │   └── src/
│   │       ā”œā”€ā”€ server.ts      # Hono router
│   │       ā”œā”€ā”€ client.ts      # Type-safe API client
│   │       ā”œā”€ā”€ routes/        # API route handlers
│   │       └── adapter/       # SvelteKit adapter
│   └── db/                # Prisma database package
│       └── src/
│           ā”œā”€ā”€ schema.prisma  # Database schema
│           └── prisma.ts      # Prisma client
ā”œā”€ā”€ docker-compose.yml     # PostgreSQL for local dev
└── package.json           # Workspace root

šŸš€ Getting Started

Prerequisites

Setup

# Clone the repository
git clone <repo-url>
cd bun-template

# Install dependencies
bun install

# Copy environment variables
cp .env.example .env

# Start PostgreSQL
bun docker:up

# Generate Prisma client & push schema
bun db:generate
bun db:push

# Start development server
bun dev

The app will be running at http://localhost:5173

šŸ“œ Available Scripts

Command Description
bun dev Start development server
bun build Build for production
bun docker:up Start PostgreSQL container
bun docker:down Stop & remove containers
bun db:generate Generate Prisma client
bun db:push Push schema to database
bun db:migrate Run database migrations
bun db:studio Open Prisma Studio

šŸ”Œ Hono API Integration

The Hono API is mounted in SvelteKit at /api/*. Define routes in pkg/api/src/routes/:

// pkg/api/src/routes/users.ts
import { Hono } from 'hono';
import { zValidator } from '@hono/zod-validator';
import { z } from 'zod';

export const usersRouter = new Hono()
  .get('/', async (c) => {
    const users = await c.get('prisma').user.findMany();
    return c.json(users);
  })
  .post('/', zValidator('json', z.object({
    email: z.string().email(),
    name: z.string()
  })), async (c) => {
    const data = c.req.valid('json');
    const user = await c.get('prisma').user.create({ data });
    return c.json(user);
  });

Type-Safe Client

Use the generated client for fully typed API calls:

// In SvelteKit components
import { api } from 'api/client';

const response = await api.users.$get();
const users = await response.json();

šŸ—ƒļø Database (Prisma)

Define your schema in pkg/db/src/schema.prisma:

model User {
  id        String   @id @default(cuid())
  email     String   @unique
  name      String?
  createdAt DateTime @default(now())
}

Then run:

bun db:generate  # Generate client types
bun db:push      # Sync schema to database

šŸŽØ Tailwind CSS

Tailwind v4 is pre-configured. Add styles in your Svelte components:

<button class="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded">
  Click me
</button>

🐳 Docker Services

Local development uses Docker Compose for PostgreSQL:

# docker-compose.yml
services:
  db:
    image: postgres:17
    ports:
      - 5432:5432
    environment:
      POSTGRES_USER: root
      POSTGRES_PASSWORD: mysecretpassword
      POSTGRES_DB: auth

šŸ“ Environment Variables

# .env
DATABASE_URL="postgresql://root:mysecretpassword@localhost:5432/auth"

šŸ“š Learn More

šŸ“„ License

MIT

Top categories

Loading Svelte Themes