Scrum4Me/README.md
janpeter visser d11b114fc1 feat: ST-601-ST-612 M6 polish, beveiliging en launch-ready
- ST-601/602: loading skeletons en error boundary
- ST-603: Sonner toasts op alle CRUD-operaties
- ST-604: DemoTooltip op uitgeschakelde knoppen
- ST-605: KeyboardSensor dnd-kit, Escape sluit modals
- ST-606: min-width banner < 1024px
- ST-607: WCAG AA aria-labels en skip link
- ST-608: rate limiting login (10/min) en registratie (5/uur)
- ST-609: security integratietests cross-user toegang (7 tests)
- ST-610: GitHub Actions CI/CD workflow
- ST-611: README met quickstart, deployment en API-docs
- ST-612: Lars-flow acceptatiechecklist
- fix: settings toont gebruikersnaam i.p.v. interne id
- fix: seed idempotent, testdata altijd gekoppeld aan demo-gebruiker

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-04-24 12:36:23 +02:00

5.5 KiB

Scrum4Me

Lichtgewicht Scrum-planner voor solo developers en kleine teams die meerdere softwareprojecten parallel beheren.

Functies:

  • Hiërarchisch werkbeheer: Product → PBI → Story → Taak
  • Gesplitste planningsschermen met drag-and-drop
  • Sprint backlog en planning
  • REST API voor integratie met Claude Code
  • Demo-modus (alleen lezen)

Lokale quickstart

Vereisten

  • Node.js 20+
  • npm

Stappen

# 1. Clone de repository
git clone <repo-url>
cd scrum4me

# 2. Installeer dependencies
npm install

# 3. Configureer omgevingsvariabelen
cp .env.example .env.local
# Bewerk .env.local en vul SESSION_SECRET in:
# openssl rand -base64 32

# 4. Database initialiseren (SQLite lokaal)
npx prisma db push

# 5. Testdata inladen
npx prisma db seed

# 6. Start de ontwikkelserver
npm run dev

Open http://localhost:3000.

Demo-account: gebruikersnaam demo / wachtwoord demo1234 (alleen lezen)


Omgevingsvariabelen

Variabele Beschrijving
DATABASE_URL SQLite: file:./dev.db · PostgreSQL: zie Neon-sectie
DIRECT_URL Alleen bij PostgreSQL met connection pooling (Neon)
SESSION_SECRET Minimaal 32 tekens — genereer met openssl rand -base64 32

Cloud deployment (Vercel + Neon)

1. Database aanmaken op Neon

  1. Maak een account op neon.tech
  2. Maak een nieuw project en database
  3. Kopieer de connection strings:
    • DATABASE_URL: de pooled connection string
    • DIRECT_URL: de directe (niet-gepoolde) connection string

2. Deployen op Vercel

  1. Push de code naar GitHub
  2. Importeer het project in vercel.com
  3. Voeg de volgende environment variables toe in Vercel:
    • DATABASE_URL (Neon pooled URL)
    • DIRECT_URL (Neon direct URL)
    • SESSION_SECRET (random string >= 32 tekens)
  4. Deploy

3. Database migraties uitvoeren

# Eenmalig na deploy:
npx prisma migrate deploy
npx prisma db seed

REST API

Alle endpoints vereisen Authorization: Bearer <token>. Maak een token aan via Instellingen -> API Tokens in de app.

Endpoints

GET /api/products

Haal alle actieve producten op.

curl -H "Authorization: Bearer <token>" \
  https://your-app.vercel.app/api/products

Response:

[
  { "id": "clx...", "name": "Mijn Product", "repo_url": "https://github.com/..." }
]

GET /api/products/:id/next-story

Haal de hoogst geprioriteerde open story uit de actieve sprint op.

curl -H "Authorization: Bearer <token>" \
  https://your-app.vercel.app/api/products/<product-id>/next-story

Response: story-object inclusief taken.


GET /api/sprints/:id/tasks?limit=10

Haal de eerste N taken uit de sprint op (standaard 10, max 50).

curl -H "Authorization: Bearer <token>" \
  "https://your-app.vercel.app/api/sprints/<sprint-id>/tasks?limit=5"

POST /api/stories/:id/log

Voeg een logvermelding toe aan een story.

# Implementatieplan:
curl -X POST -H "Authorization: Bearer <token>" \
  -H "Content-Type: application/json" \
  -d '{"type":"IMPLEMENTATION_PLAN","content":"Aanpak: ..."}' \
  https://your-app.vercel.app/api/stories/<story-id>/log

# Testresultaat:
curl -X POST -H "Authorization: Bearer <token>" \
  -H "Content-Type: application/json" \
  -d '{"type":"TEST_RESULT","content":"Alle tests geslaagd","status":"PASSED"}' \
  https://your-app.vercel.app/api/stories/<story-id>/log

# Commit:
curl -X POST -H "Authorization: Bearer <token>" \
  -H "Content-Type: application/json" \
  -d '{"type":"COMMIT","content":"feat: ST-001","commit_hash":"abc123","commit_message":"feat: ST-001 scaffolding"}' \
  https://your-app.vercel.app/api/stories/<story-id>/log

PATCH /api/stories/:id/tasks/reorder

Pas de taakvolgorde aan binnen een story.

curl -X PATCH -H "Authorization: Bearer <token>" \
  -H "Content-Type: application/json" \
  -d '{"task_ids":["id-1","id-2","id-3"]}' \
  https://your-app.vercel.app/api/stories/<story-id>/tasks/reorder

PATCH /api/tasks/:id

Werk de status van een taak bij.

curl -X PATCH -H "Authorization: Bearer <token>" \
  -H "Content-Type: application/json" \
  -d '{"status":"IN_PROGRESS"}' \
  https://your-app.vercel.app/api/tasks/<task-id>

Status waarden: TO_DO - IN_PROGRESS - DONE


POST /api/todos

Maak een todo aan.

curl -X POST -H "Authorization: Bearer <token>" \
  -H "Content-Type: application/json" \
  -d '{"title":"Mijn nieuwe todo"}' \
  https://your-app.vercel.app/api/todos

Claude Code integratie

Scrum4Me integreert met Claude Code via de REST API.

  1. Maak een API token aan via Instellingen -> API Tokens
  2. Gebruik de API om implementatieplannen, testresultaten en commits automatisch te loggen in stories

Scripts

Script Beschrijving
npm run dev Lokale ontwikkelserver
npm run build Productie-build
npm run lint ESLint
npm test Beveiligingstests uitvoeren
npx tsc --noEmit TypeScript-check
npx prisma db push Database schema synchroniseren
npx prisma db seed Testdata inladen

Tech stack

  • Next.js 15 (App Router) + React 19
  • TypeScript strict
  • Tailwind CSS + shadcn/ui (Base UI)
  • Zustand (client state)
  • dnd-kit (drag-and-drop)
  • Prisma v7 (ORM)
  • PostgreSQL (Neon) / SQLite (lokaal)
  • iron-session (auth)
  • Sonner (toasts)
  • Zod (validatie)