Skylarks Diamond Planner

Progressive Web App for the Berlin Skylarks Baseball & Softball Club. Built with Pocketbase and SvelteKit with the static adapter.

Concept / Background

Main rationale to create this project: At project start, different types of data were being processed in different web services:

• The main administrative platform Baseball & Softball Manager / BSM of the German Baseball & Softball Federation (DBV).
  • Everything related to organised play is processed there (clubs, games, leagues, teams, player, stats)
  • Accessed via REST API
  • External: no club access to any internal logic
• The current Skylarks website, served as a TYPO3 CMS website ( PHP-based).
  • Processes mostly typical CMS content (articles, info pages), but also additional team data that is distinct from BSM data: club teams, player profiles (with more data than what is available in BSM), training times, game reports
  • Mainly displayed in the TYPO3 frontend (server-side templating) directly, but is also partly accessible via REST API
  • Internal: custom-built, full club access

See also: Project History

Project goal

• collect data from all relevant sources and displays it in a user-friendly way
• Progressive Web App with mobile-first design
• provide logic to carry out team organisation tasks (practice and game attendance, teams and members, stats)
• → replace existing external tools for those tasks
• become THE central hub for team activities

Design decisions

• This tool will process administrative data for club and team events (events, announcements, comments, attendance data and statistics)
• this data will be distinct from both CMS and BSM data:
  • BSM data relates to the club's organised play ⇒ main use case is external
  • CMS data is strictly presentational, the CMS does not care about administrative logic ⇒ main use case is external
  • ⇒ here, the main use case is internal

Project requirements

• basic familiarity with the concepts of SvelteKit and Svelte – there is an excellent official tutorial available
• Go v1.27 or higher
• Node.js v24 or higher
• access to Berlin Skylarks environment secrets and API keys

Local Development

1. Clone the repository

2. Set up environment

cp .env.dist .env

• PUBLIC_TYPO3_URL can either be set to a TYPO3 dev environment running locally or the production URL

3. Get project dependencies

backend

go mod download
go run . serve

frontend

cd ui
pnpm install
# yarn/deno/bun could also work, untested

4. Start the dev server (frontend watches for file changes automatically, backend needs to be restarted manually)

backend

go run . serve

frontend

cd ui
pnpm dev

URLs

Local/Development

• Go Backend: http://127.0.0.1:8090/
• Vite Frontend: http://localhost:5173/

Production

• unified URL: https://app.berlinskylarks.de/

Deployment

• as this project is hosted on a self-hosted Forgejo instance, there is no automatic CI/CD workflow implemented at the moment.
• images are built on the local development machine with the provided bash scripts in the project root
• there are scripts for staging and production environment with slightly different build arguments
• the images are pulled on the target server according to the specification that is connected to this git repository.
• environment variables are supplied directly to the containers

Backend-specific documentation

Pocketbase Schema

• the file pb_schema.json is an export of the currently configured collections access rules.
• it acts as a source of truth for the backend schema
• in addition, pocketbase migrations are saved in the corresponding folder
• for type-safe access to custom models, RecordProxy structs are used
• TS types are generated on the frontend side

Bugs and Problems

• Please open an issue in this repository.

Terms of use

Licensed under AGPL-3.

---

Explore other templates from The Good Docs Project. Use our feedback form to give feedback on this template.

---