| [83faa57] | 1 | # Klonkt Beta
|
|---|
| [7bc636b] | 2 |
|
|---|
| 3 | Persoonlijk multi-site platform met editorial-feel content + sociale community.
|
|---|
| [8453812] | 4 | Gebouwd op **Node + SQLite + htmx** — licht, zelf-gehost, en van jou.
|
|---|
| [7bc636b] | 5 |
|
|---|
| [8453812] | 6 | > **Wat het is.** Geen *publishing tool* maar een *persoonlijk canvas* — content,
|
|---|
| 7 | > profiel, sociale interactie en realtime in één.
|
|---|
| [7bc636b] | 8 |
|
|---|
| 9 | ## Filosofie
|
|---|
| 10 |
|
|---|
| [5a2cb69] | 11 | - **Editorial feel.** Magazine-typografie (Fraunces + Literata + Plus Jakarta), royale spacing, 12 paletten (o.a. Sage, Paper, Ocean, Forest, Stone, Midnight, Sunset, Cream, Rose, Goud, Terracotta, Lilac). Light + dark per palette.
|
|---|
| [7bc636b] | 12 | - **App-feel waar het telt.** Geen full page reloads — htmx swaps + (binnenkort) View Transitions. Voelt als app, niet als website.
|
|---|
| 13 | - **Server-rendered.** Geen build step, geen SPA-tax. EJS + htmx + minimale Alpine.
|
|---|
| 14 | - **Realtime ingebouwd.** WebSocket server zit in `src/websocket/`. SSE als alternatief beschikbaar.
|
|---|
| 15 | - **Privacy-first.** Self-hosted fonts, geen third-party requests, geen tracking.
|
|---|
| 16 |
|
|---|
| 17 | ## Roadmap
|
|---|
| 18 |
|
|---|
| 19 | | Fase | Scope | Status |
|
|---|
| 20 | |------|-------|--------|
|
|---|
| 21 | | **1.0 — v9-feel** | Homepage, profile-header, feed, post-detail visueel matchen met v9 | 🟡 in progress |
|
|---|
| 22 | | **1.1 — auth + posts** | Login / register / post CRUD compleet | ✅ klaar |
|
|---|
| 23 | | **1.2 — sociale laag** | Comments, Prutter (DMs zonder E2EE), notifications | ⚪ na 1.0 |
|
|---|
| 24 | | **1.3 — app-feel** | View Transitions, optimistic UI, swipe-actions, haptics | ⚪ |
|
|---|
| 25 | | **1.4 — bottom-tab nav** | Native-app-stijl navigatie op mobiel, sidebar op desktop | ⚪ |
|
|---|
| 26 | | **2.0 — E2EE DMs** | MLS protocol via `@openmls/openmls`, single-device first | ⚪ apart project |
|
|---|
| 27 |
|
|---|
| [5a2cb69] | 28 | ## Zelf hosten
|
|---|
| 29 |
|
|---|
| 30 | Klonkt is een **Node-app** (geen PHP) — draai 'm op een VPS, in Docker of op een
|
|---|
| 31 | Node-hostingplatform. **Niet** op klassieke shared PHP-hosting. De database
|
|---|
| 32 | (SQLite) maakt zichzelf aan bij de eerste start; er is geen los installatiescript.
|
|---|
| 33 |
|
|---|
| 34 | ### Optie A — Docker (aanbevolen)
|
|---|
| 35 |
|
|---|
| 36 | Alles (Node, ffmpeg, cwebp) zit in het image; je hoeft alleen Docker te hebben.
|
|---|
| [7bc636b] | 37 |
|
|---|
| 38 | ```bash
|
|---|
| [5a2cb69] | 39 | git clone <repo-url> klonkt && cd klonkt
|
|---|
| [7bc636b] | 40 | cp .env.example .env
|
|---|
| [5a2cb69] | 41 | # vul in .env minimaal in: SESSION_SECRET (>=32 random tekens) + PUBLIC_BASE_URL
|
|---|
| 42 | docker compose up -d
|
|---|
| [7bc636b] | 43 | ```
|
|---|
| 44 |
|
|---|
| [5a2cb69] | 45 | De app draait nu op poort 3000. Alle data (database + geüploade media/audio)
|
|---|
| 46 | blijft bewaard in het `klonkt-data`-volume, ook na een update. Updaten:
|
|---|
| 47 |
|
|---|
| 48 | ```bash
|
|---|
| 49 | git pull && docker compose up -d --build
|
|---|
| 50 | ```
|
|---|
| 51 |
|
|---|
| 52 | ### Optie B — direct met Node (Node 20+)
|
|---|
| 53 |
|
|---|
| 54 | ```bash
|
|---|
| 55 | git clone <repo-url> klonkt && cd klonkt
|
|---|
| 56 | npm ci
|
|---|
| 57 | cp .env.example .env # SESSION_SECRET + PUBLIC_BASE_URL invullen
|
|---|
| 58 | npm start # database wordt bij de eerste start aangemaakt
|
|---|
| 59 | ```
|
|---|
| 60 |
|
|---|
| 61 | Open http://localhost:3000. Voor productie: zet 'm achter een procesmanager
|
|---|
| 62 | (pm2/systemd) zodat 'ie aanblijft. `cwebp` is optioneel (Debian/Ubuntu:
|
|---|
| 63 | `apt install webp`) voor WebP-afbeeldingen — ontbreekt 'ie, dan wordt het
|
|---|
| 64 | origineel bewaard. (`npm run dev` = watch-mode voor ontwikkeling.)
|
|---|
| 65 |
|
|---|
| 66 | ### HTTPS (productie)
|
|---|
| 67 |
|
|---|
| 68 | Zet een reverse-proxy vóór de app voor TLS. Met **Caddy** (automatisch
|
|---|
| 69 | Let's Encrypt) volstaat één blok:
|
|---|
| 70 |
|
|---|
| 71 | ```caddy
|
|---|
| 72 | jouwdomein.nl {
|
|---|
| 73 | reverse_proxy localhost:3000
|
|---|
| 74 | encode gzip zstd
|
|---|
| 75 | }
|
|---|
| 76 | ```
|
|---|
| 77 |
|
|---|
| 78 | ### Eerste keer
|
|---|
| 79 |
|
|---|
| 80 | Open je site en ga naar **`/auth/register`** — de **eerste gebruiker wordt
|
|---|
| 81 | automatisch beheerder**; daarna sluit registratie zich. Wachtwoord kwijt?
|
|---|
| 82 | `npm run reset-admin` (in Docker: `docker compose exec klonkt npm run reset-admin`).
|
|---|
| [7bc636b] | 83 |
|
|---|
| 84 | ## Stack
|
|---|
| 85 |
|
|---|
| 86 | - **Runtime:** Node 20+
|
|---|
| 87 | - **Web:** Express + Helmet + express-session
|
|---|
| 88 | - **DB:** better-sqlite3 (WAL mode)
|
|---|
| 89 | - **Templates:** EJS (server-rendered)
|
|---|
| 90 | - **Frontend interactie:** htmx 1.9 (vendored)
|
|---|
| 91 | - **Realtime:** ws (WebSocket)
|
|---|
| 92 | - **Fonts:** self-hosted variable woff2 (Fraunces / Literata / Plus Jakarta Sans)
|
|---|
| 93 |
|
|---|
| 94 | ## Project structure
|
|---|
| 95 |
|
|---|
| 96 | ```
|
|---|
| 97 | src/
|
|---|
| 98 | ├── server.js # Express bootstrap, routes mounting, WS server
|
|---|
| 99 | ├── config/ # database, env loading
|
|---|
| 100 | ├── db/migrations/ # SQLite schema (001-init.sql)
|
|---|
| 101 | ├── middleware/ # auth, render (htmx-aware), site, rate-limit
|
|---|
| 102 | ├── routes/ # per-resource Express routers
|
|---|
| 103 | ├── services/ # domain logic (Prutter, Audio, Theme, Permissions, ...)
|
|---|
| 104 | ├── views/
|
|---|
| 105 | │ ├── shell.ejs # outer document (head, nav, footer)
|
|---|
| 106 | │ ├── partials/ # topnav, profile-header, post-card, post-tile
|
|---|
| 107 | │ └── pages/ # home, post, account, admin, ...
|
|---|
| 108 | ├── assets/
|
|---|
| 109 | │ ├── css/style.css # v9 stylesheet — palette tokens, components
|
|---|
| 110 | │ ├── fonts/ # variable woff2
|
|---|
| 111 | │ └── js/ # htmx, audio-player
|
|---|
| 112 | └── websocket/ # WS server for realtime (notifications, prutter, presence)
|
|---|
| 113 | ```
|
|---|
| 114 |
|
|---|
| [8453812] | 115 | ## Import
|
|---|
| [7bc636b] | 116 |
|
|---|
| [8453812] | 117 | Importer voor bestaande bestandsgebaseerde content is gepland voor v1.1.
|
|---|
| 118 | Pad: `posts/*.md` + `users.json` + `sites/*/config.json` → SQLite.
|
|---|
| [7bc636b] | 119 |
|
|---|
| 120 | ## License
|
|---|
| 121 |
|
|---|
| 122 | Persoonlijk project. Niet bedoeld voor publieke distributie tot verder bericht.
|
|---|
| 123 |
|
|---|
| 124 | ## Deployed via git workflow on 2026-04-30
|
|---|
| 125 |
|
|---|