A complete, fullstack template for Svelte. Checkout spatz-2 for a more the current version based on Svelte 5.
- 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.
- Create a directory for your Pocketbase instance and navigate to it.
mkdir pb-spatz
cd pb-spatz- 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"-
Log in to the Pocketbase admin console at
http://localhost:8090/_/and create a new database. -
Go to settings > Import collections, then paste in the contens of
./pocketbase/pb_schema.json(from this repo) and click import.
- Clone the repo and navigate to the project directory.
git clone https://github.com/engageintellect/spatz
cd spatz- Copy .env.example and replace the values with your own.
cp .env.example .env.local (or .env)- Install the dependencies and start the development server.
pnpm i && pnpm run dev --host- Open your browser to
http://localhost:5173to see the app.
/src
├── /lib
│ └── app.d.ts (global types)
├── /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 are provided by iconify/svelte. You can search for icons on Icones.
The app comes pre-loaded with all of the standard themes from DaisyUI. You can also create your own here
Animations are provided by GSAP and are easy to implement. You can find the documentation here.
Contributions are welcomed, and appreciated. If you have a feature request, please add it as an issue or make a pull request.