PocketBase SvelteKit Starter

https://github.com/spinspire/pocketbase-sveltekit-starter
Admin
A starter application combining PocketBase as a backend and SvelteKit for a static, high-performance...
Tokens:3,787
Snippets:17
Trust Score:6.6
License:MIT
Update:1 year ago
Show doc for...
Tokens:
Raw
### Docker Setup Commands

Source: https://github.com/spinspire/pocketbase-sveltekit-starter/blob/master/README.md

Commands for setting up the PocketBase SvelteKit starter application using Docker. This includes starting the Docker services, installing frontend dependencies, and running backend/frontend development servers.

```shell
docker compose up -d
npx pnpm install
npm run dev:backend
npm run dev
```

--------------------------------

### PocketBase Backend Commands

Source: https://github.com/spinspire/pocketbase-sveltekit-starter/blob/master/pb/README.md

Core commands for managing the PocketBase backend, including running migrations and serving the application. These commands are essential for initializing the database and starting the server.

```shell
./pocketbase migrate up
# Runs database migrations to set up the schema.
```

```shell
./pocketbase serve
# Starts the PocketBase server.
```

```shell
./pocketbase serve --publicDir ../frontend/build
# Starts the PocketBase server and serves frontend assets.
```

--------------------------------

### PocketBase Binary Setup (JavaScript Extensions)

Source: https://github.com/spinspire/pocketbase-sveltekit-starter/blob/master/README.md

Steps for setting up the PocketBase backend using a downloaded binary, intended for JavaScript-exclusive customizations. This involves placing the binary and running it with specific arguments for serving the SvelteKit build.

```shell
# Navigate to /sk directory
npm run backend

# For Windows, modify package.json script:
# "backend": "cd .. && cd pb && pocketbase serve --publicDir=../sk/build"
```

--------------------------------

### Go Build and Development Tools

Source: https://github.com/spinspire/pocketbase-sveltekit-starter/blob/master/pb/README.md

Commands and tools for building the PocketBase backend from source using Go, and for enabling live development with modd. This is for users who want to extend PocketBase with Go.

```go
go build
# Compiles the PocketBase Go application.
```

```shell
go install github.com/cortesi/modd/cmd/modd@latest
# Installs the modd tool for live development.
```

```shell
modd
# Starts the modd development server for live reloading.
```

--------------------------------

### Install and Run Modd for Live Development

Source: https://github.com/spinspire/pocketbase-sveltekit-starter/blob/master/README.md

Installs `modd`, a file watcher that automatically rebuilds and restarts the Go backend on code changes. After installation, running `modd` starts the development server.

```bash
go install github.com/cortesi/modd/cmd/modd@latest
modd
```

--------------------------------

### Develop SvelteKit Frontend

Source: https://github.com/spinspire/pocketbase-sveltekit-starter/blob/master/README.md

Navigates to the SvelteKit frontend directory (`sk`) and starts the development server using npm. This allows for live reloading of frontend changes.

```bash
cd sk
npm run develop
```

--------------------------------

### Verify Go Installation

Source: https://github.com/spinspire/pocketbase-sveltekit-starter/blob/master/README.md

Checks if the Go compiler is installed on the system. Requires Go to be pre-installed or installed separately according to OS instructions.

```bash
go version
```

--------------------------------

### Develop Svelte Project

Source: https://github.com/spinspire/pocketbase-sveltekit-starter/blob/master/sk/README.md

Start a development server after installing dependencies with `npm install`. The `npm run dev -- --open` command also launches the app in a new browser tab.

```bash
npm run dev

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

--------------------------------

### SvelteKit Frontend Development (JavaScript/TypeScript)

Source: https://github.com/spinspire/pocketbase-sveltekit-starter/blob/master/README.md

Commands for setting up and running the SvelteKit frontend development server. This includes installing dependencies and starting the development server which supports Hot Module Reloading (HMR).

```javascript
// In /sk directory:
npx pnpm install
npm run dev
```

--------------------------------

### Docker Compose for Development

Source: https://github.com/spinspire/pocketbase-sveltekit-starter/blob/master/pb/README.md

Configuration files for running PocketBase and related services using Docker Compose. This is a recommended approach for consistent development environments across different operating systems.

```docker
docker-compose up
# Starts all services defined in docker-compose.yml.
```

```docker
docker-compose up -d
# Starts services in detached mode.
```

--------------------------------

### TypeScript Type Generation

Source: https://github.com/spinspire/pocketbase-sveltekit-starter/blob/master/pb/README.md

Script for generating TypeScript definitions for your PocketBase database collections. This ensures type safety when interacting with your data from the frontend.

```javascript
npm run typegen
# Executes the type generation script, typically found in package.json.
```

--------------------------------

### PocketBase Backend Development (Go)

Source: https://github.com/spinspire/pocketbase-sveltekit-starter/blob/master/README.md

Instructions for building and running the PocketBase backend server written in Go. This involves compiling the Go binary and using `modd` for live development, which restarts the server upon Go code changes.

```go
// Example of a Go hook or API endpoint (conceptual, actual code in project)
// package main
// import "fmt"
// func main() {
// 	// PocketBase server setup and extension logic here
// 	fmt.Println("PocketBase server starting...")
// }
```

--------------------------------

### Build Go Backend

Source: https://github.com/spinspire/pocketbase-sveltekit-starter/blob/master/README.md

Compiles the Go backend application. This command builds the executable for the PocketBase backend.

```bash
go build
```

--------------------------------

### Tidy Go Modules

Source: https://github.com/spinspire/pocketbase-sveltekit-starter/blob/master/README.md

Ensures the Go module dependencies are correctly managed and downloaded. Navigates to the `/pb` directory and runs `go mod tidy`.

```bash
cd /pb
go mod tidy
```

--------------------------------

### PocketBase JavaScript API Overview

Source: https://github.com/spinspire/pocketbase-sveltekit-starter/blob/master/README.md

Reference to PocketBase's JavaScript SDK documentation for extending the backend with custom logic. This includes details on hooks, API endpoints, and database interactions.

```APIDOC
PocketBase JavaScript SDK:
  Purpose: Extend PocketBase backend functionality using JavaScript.
  Features:
    - Hooks: Execute custom logic on database events (create, update, delete).
    - API Endpoints: Define custom API routes accessible from the frontend.
    - Realtime Subscriptions: Listen for data changes.
    - Authentication: Manage user authentication flows.
  Documentation:
    - https://pocketbase.io/docs/js-overview/
    - https://pocketbase.io/docs/js-hooks/
    - https://pocketbase.io/docs/js-api-routes/
  Example (Conceptual Hook):
    // pb/pb_hooks/main.pb.ts
    // import PocketBase from 'pocketbase'
    // import type { TypedResponse } from '@sveltejs/kit'
    // 
    // export async function onCreateRecord(e: { record: Record, collectionId: string, collectionName: string, action: string, url: string, event: Event }): Promise<void> {
    //   console.log('Record created:', e.record.id)
    //   // Add custom logic here, e.g., sending notifications
    // }
```

--------------------------------

### Create Svelte Project

Source: https://github.com/spinspire/pocketbase-sveltekit-starter/blob/master/sk/README.md

Use `npm create svelte@latest` to scaffold a new Svelte project. This command can create a project in the current directory or a specified subdirectory.

```bash
# create a new project in the current directory
npm create svelte@latest

# create a new project in my-app
npm create svelte@latest my-app
```

--------------------------------

### Build Svelte Project

Source: https://github.com/spinspire/pocketbase-sveltekit-starter/blob/master/sk/README.md

Generate a production-ready build of your Svelte application using `npm run build`. You can preview this build locally with `npm run preview`.

```bash
npm run build

# You can preview the production build with `npm run preview`.
```
Tokens:
Raw