#heading[Buildtools en ontwikkelcommando's]

Serengo maakt gebruik van een moderne JavaScript-toolchain gebaseerd op SvelteKit en Vite, aangevuld met TypeScript, ESLint/Prettier en Drizzle voor databasebeheer [@sveltekit-docs; @vite-docs; @drizzle-docs]. In dit hoofdstuk worden de belangrijkste tools en commando's samengevat.

== Bundling en framework

- *Framework*: SvelteKit 2 met Svelte 5-componenten en runes (`$props`, `$derived`, `$effect`).
- *Bundler/dev-server*: Vite 7, geconfigureerd in `vite.config.ts`.
- *Adapter*: `@sveltejs/adapter-node` voor een Node.js-productieserver (`svelte.config.js`).

De bundling gebeurt via Vite: tijdens ontwikkeling draait een snelle dev-server met hot module replacement; voor productie wordt een geoptimaliseerde bundel gebouwd met code-splitting en tree-shaking.

== Ontwikkelcommando's (pnpm scripts)

De belangrijkste commando's (zie `package.json`) zijn:

- `pnpm run dev`
  - Start de Vite dev-server met SvelteKit in ontwikkelmodus.
  - Handig tijdens actieve ontwikkeling; herlaadt automatisch bij codewijzigingen.

- `pnpm run build`
  - Maakt een productiebuild van de applicatie.
  - Gebruikt Vite + SvelteKit om geoptimaliseerde JavaScript en CSS te genereren.

- `pnpm run preview`
  - Start een lokale server bovenop de productiebuild.
  - Wordt gebruikt om de uiteindelijke build te testen voor deployment.

- `pnpm run check`
  - Voert `svelte-kit sync` en vervolgens `svelte-check` uit met de `tsconfig.json`.
  - Controleert TypeScript-typen en Svelte-componenten op fouten.

- `pnpm run lint`
  - Voert eerst `prettier --check .` en daarna `eslint .` uit.
  - Zorgt voor consistente code-stijl en detecteert mogelijke probleemgevallen.

- `pnpm run format`
  - Draait Prettier in schrijfmodus (`--write`) over het project.
  - Past de afgesproken formatteringsregels (tabs, single quotes, max 100 chars) toe.

== Databasetools (Drizzle ORM)

Voor het beheer van de PostgreSQL-database wordt Drizzle ORM gebruikt, met bijhorende CLI-commando's:

- `pnpm run db:start`
  - Start de PostgreSQL-database via `docker-compose` (zie `docker-compose.yml`).

- `pnpm run db:generate`
  - Genereert migratiebestanden op basis van wijzigingen in het Drizzle-schema (`src/lib/server/db/schema.ts`).

- `pnpm run db:migrate`
  - Voert de gegenereerde migraties uit op de database.
  - Wordt zowel lokaal als in de Docker-deployment gebruikt (entrypoint script).

- `pnpm run db:push`
  - Pusht de huidige schema-definitie naar de database (handig in vroege ontwikkelfase).

- `pnpm run db:studio`
  - Start Drizzle Studio voor het visueel inspecteren van de database.

- `pnpm run db:generate-erd`
  - Gebruikt `drizzle-erd` om op basis van het schema een ERD (`erd.svg`) te genereren.

== ESLint, Prettier en typechecking

- *ESLint*: bewaakt codekwaliteit en dwingt consistente patterns af, met ondersteuning voor Svelte (`eslint-plugin-svelte`) en moderne JavaScript/TypeScript-regels.
- *Prettier*: zorgt voor automatische formattering met de in `AGENTS.md` vastgelegde stijl.
- *TypeScript + svelte-check*: zorgen voor statische typeveiligheid doorheen de hele stack.

Samen vormen deze tools een sterke ontwikkelbasis: fouten worden vroegtijdig opgespoord, de code blijft leesbaar en het buildproces is voorspelbaar en reproduceerbaar.