DevTools

Eine wachsende Sammlung kleiner Werkzeuge fürs tägliche Web-Doing. Den Anfang macht eine Chrome-Extension für Auto-Reload per Webhook — weitere Tools folgen.

Tools

Auto-Reload Webhook

Webhook-Server für die DevTools Auto Refresh Chrome-Extension. Nach Trigger via HTTP-Call werden alle browser-seitig konfigurierten Tabs (mit passendem URL-Prefix) automatisch neu geladen.

Endpoints

MethodePfadZweck
POST/GET/api/deploy.phpDeploy-Event triggern (curl/Bash/CI/Browser)
GET/api/events.phpServer-Sent-Events (von Extension)

Auth

Bearer-Token im Authorization-Header oder ?token=-Querystring.

Aktive Tokens: 2 · Erstes (maskiert): 884332••••••••••••••••09ef

Tokens leben in /home/devtools/secrets/tokens.json. Alte Tokens bleiben unbegrenzt gültig — neue können hier sofort generiert werden.

Neuen Token generieren

Tipp: Hänge ?token=DEIN_TOKEN an die Adresse dieser Seite, um deine konkreten Webhook-URLs (mit Token eingebaut) zu sehen — bequem zum Copy-Pasten in andere Systeme.

Webhook von überall triggern

Du brauchst die id die du in der Extension dem URL-Prefix zugeordnet hast (z.B. nodeboss). Auf dieser Maschine sind keine weiteren Voraussetzungen nötig.

1. curl (Bash, CI, Server)

curl -fsS "https://devtools.kreativkollektiv.at/api/deploy.php?id=nodeboss&token=YOUR_TOKEN"

Antwortet mit HTTP 202 + {"ok":true,...}. Bei falschem Token: 401, falscher id: 400.

2. Browser / Bookmark / Lesezeichen

https://devtools.kreativkollektiv.at/api/deploy.php?id=nodeboss&token=YOUR_TOKEN

Praktisch: Lesezeichen pro Projekt — Klick = Trigger.

3. POST mit JSON (sicherer, Token im Header)

curl -fsS -X POST "https://devtools.kreativkollektiv.at/api/deploy.php" \
  -H "Authorization: Bearer YOUR_TOKEN" \
  -H "Content-Type: application/json" \
  -d '{"id":"nodeboss","note":"manual deploy"}'

4. CLI-Helper auf einem anderen Rechner installieren

# Einmal installieren:
sudo curl -fsSL "https://devtools.kreativkollektiv.at/deploy-notify" -o /usr/local/bin/deploy-notify
sudo chmod +x /usr/local/bin/deploy-notify
echo "YOUR_TOKEN" > ~/.devtools-deploy.token
chmod 600 ~/.devtools-deploy.token

# Verwendung:
deploy-notify nodeboss

5. GitHub Webhook

Repo → Settings → Webhooks → Add webhook

Payload URL: https://devtools.kreativkollektiv.at/api/deploy.php?id=nodeboss&token=YOUR_TOKENContent-Type: application/json
Events: just the push event
Weitere Beispiele: VSCode-Task, npm-Skript, Git-Hook

VSCode tasks.json

{
  "version": "2.0.0",
  "tasks": [{
    "label": "deploy-notify nodeboss",
    "type": "shell",
    "command": "curl",
    "args": ["-fsS", "https://devtools.kreativkollektiv.at/api/deploy.php?id=nodeboss&token=YOUR_TOKEN"],
    "presentation": { "reveal": "silent" }
  }]
}

npm script (package.json)

"scripts": {
  "deploy:notify": "curl -fsS 'https://devtools.kreativkollektiv.at/api/deploy.php?id=nodeboss&token=YOUR_TOKEN'"
}

Git post-receive Hook (server-side)

#!/usr/bin/env bash
curl -fsS "https://devtools.kreativkollektiv.at/api/deploy.php?id=nodeboss&token=YOUR_TOKEN" || true

Stream-Debug (welche Events kommen wirklich an?)

curl -N "https://devtools.kreativkollektiv.at/api/events.php?token=YOUR_TOKEN"

Sollte sofort : connected zeigen, alle 20s : heartbeat, und nach jedem Trigger event: deploy / data: {...}.

Extension-Download

Aktuelle Version: 0.1.7

Download: extension-0.1.7.zip (16,1 KB)

Einrichtung: in Chrome chrome://extensions → "Entpackt laden" → das ZIP entpacken und Verzeichnis wählen. Dann in Optionen die SSE-URL und das Token eintragen sowie id → URL-Prefix-Mappings konfigurieren.

Sicherheit