71 lines
3.2 KiB
XML
71 lines
3.2 KiB
XML
#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.
|