spatz

spatz

An opinionated template for building full-stack Svelte applications ridiculously fast. Includes auth, database, admin panel, user dashboard, themes, icons, and more.

Stars: 74

Visit
 screenshot

Spatz is a complete, fullstack template for Svelte that includes features such as Sveltekit for building fast web apps, Pocketbase for User Auth and Database, OpenAI for chatbots, Vercel AI SDK for AI/ML models, TailwindCSS for UI development, DaisyUI for components, and Zod for schema declaration and validation. The template provides a structured project setup with components, stores, routes, and APIs. It also offers theming and styling options with pre-loaded themes from DaisyUI. Contributions are welcomed through feature requests or pull requests.

README:

spatz

Description

A complete, fullstack template for Svelte.

Demo App

Image Description

Image Description

Features

  • Sveltekit: Futuristic web framework for building blazing fast web apps.
  • Pocketbase: Self-contained User Auth, Database, Admin UI, and API documentation.
  • OpenAI: chatGPT 3.5-turbo & 4.0-turbo for contextually aware chatbots.
  • Vercel AI SDK: AI/ML models for image, text, and audio processing.
  • TailwindCSS: A utility-first CSS framework for rapid UI development.
  • DaisyUI: A tailwind-based component library.
  • Zod: TypeScript-first schema declaration and validation.

Screenshots

Home & Features

Image Description

User Profile & Settings UI

Image Description

Client/Pocketbase UI

Image Description Image Description

Getting Started

Pocketbase Setup

  1. Create a directory for your Pocketbase instance and navigate to it.
mkdir pb-spatz
cd pb-spatz
  1. Download the latest release of Pocketbase, unzip it, and start the server.
wget https://github.com/pocketbase/pocketbase/releases/download/v0.22.9/pocketbase_0.22.9_linux_amd64.zip
unzip pocketbase_0.22.9_linux_amd64.zip
./pocketbase serve --http="0.0.0.0:8090"
  1. Log in to the Pocketbase admin console at http://localhost:8090/_/ and create a new database.

  2. Go to settings > Import collections, then paste in the contens of ./pocketbase/pb_schema.json (from this repo) and click import.

Client Setup

  1. Clone the repo and navigate to the project directory.
git clone https://github.com/engageintellect/spatz
cd spatz
  1. Copy .env.example and replace the values with your own.
cp .env.example .env.local (or .env)
  1. Install the dependencies and start the development server.
pnpm i && pnpm run dev --host
  1. Open your browser to http://localhost:5173 to see the app.

Development

Project Structure

/src
├── /lib
├── /assets
│   └── /images
├── /components
├── /stores (global state)
├── /routes
│   ├── /guestbook
│   ├── /ai (nested routes)
│   │   ├── /a
│   │   ├── /b
│   │   └── /c
│   ├── /api
│   │   ├── /repoData (fetch github repository stars)
│   │   ├── /chat (OpenAI streaming API)
│   │__ /auth (Pocketbase auth)
│   │   ├── /login
│   │   ├── /register
│   │   ├── /logout
│   │   └── /reset-password
│   └── /my (user-specific routes)
│       ├── /account
│       ├── /profile
│       └── /settings
/pocketbase
├── pb_schema.json
/static
└── /docs (general documentation)

Icons

Icons are provided by iconify/svelte. You can search for icons on Icones.

Theming and Styling

The app comes pre-loaded with all of the standard themes from DaisyUI. You can also create your own here

Contributing to spatz

Contributions are welcomed, and appreciated. If you have a feature request, please add it as an issue or make a pull request.

For Tasks:

Click tags to check more tools for each tasks

For Jobs:

Alternative AI tools for spatz

Similar Open Source Tools

For similar tasks

For similar jobs