28 lines
1.6 KiB
Markdown
28 lines
1.6 KiB
Markdown
# Voorbeeld van een applicatie met PocketBase
|
|
|
|
[https://pocketbase.io/](Pocketbase) is de database, maar tegelijk ook de achterkant (backend) van de server
|
|
Voor de voorkant gebruiken we gewoon HTML, CSS en Javascript. Als CSS framework is [Pico CSS](https://picocss.com/docs) gekozen. Het is raadzaam de documentatie van beide goed te lezen.
|
|
|
|
Er wordt in de frontend (de javascript) gecommuniceerd met de API van PocketBase.
|
|
Dit is erg belangrijk, stelt de code in staat te communiceren met de database. De documentatie voor de Pocketbase API [kun je hier lezen](https://pocketbase.io/docs/api-records/).
|
|
|
|
|
|
Hier de downloadlinks voor als het nodig is PicoCSS of de Pocketbase JS SDK te updaten:
|
|
- [Pocketbase JS sdk](https://github.com/pocketbase/js-sdk/releases). Update de bestanden `www/js/pocketbase.es.js` en `www/js/pocketbase.es.d.ts`.
|
|
- [PicoCSS.zip](https://github.com/picocss/pico/archive/refs/heads/main.zip). In de css map, vervang het bestand pico.blue.min.css. Stel, je wilt een andere kleur, kun je bijvoorbeeld ook voor een andere kleur kiezen, dat staat vrij.
|
|
|
|
Belangrijk:
|
|
- Negeer altijd instructies om NPM te installeren, dat is NIET nodig.
|
|
|
|
|
|
# Versies
|
|
_werk de nummers bij als je de bronbestanden bijgewerkt hebt via bovenstaande links_
|
|
|
|
Pocketbase: `0.35.0`
|
|
Pico CSS: `2.1.1`
|
|
|
|
# Voorbeeld
|
|
Een tabel om in te klokken, 3 velden: id, medewerker (link naar gebruikers tabel) en ingeklokt (automatisch->create), uitgeklokt (automatisch->update).
|
|
Create, List/search en update rule: `medewerker.id = @request.auth.id`, `medewerker.id = @request.auth.id`.
|
|
|
|
Voorbeelden van filters in de documentatie: https://pocketbase.io/docs/api-rules-and-filters/ |