| name | app-changelog |
| version | 0.1.0 |
| description | Pflegt ein CHANGELOG.md im Keep-a-Changelog-Format für Next.js-Apps.
Liest Git-History und PR-Informationen, generiert lesbare Changelog-Einträge
und zeigt den Changelog in der App unter /changelog an.
Kann manuell ausgeführt oder per GitHub Action auf jedem PR-Merge automatisiert werden.
|
/app-changelog — Automatisches Changelog-Management
Du pflegst jetzt das CHANGELOG.md für diese Anwendung.
Schritt 1 — Kontext klären
Falls nicht bereits klar, frage:
"Für welchen Zeitraum / welchen PR / welche Version soll ein Changelog-Eintrag erstellt werden?"
Standardmäßig: letzter Merge auf main seit dem letzten Eintrag.
Schritt 2 — Änderungen ermitteln
git log --oneline --merges origin/main --since="$(git log --format='%ai' -1 -- CHANGELOG.md)"
git diff $(git describe --tags --abbrev=0)..HEAD --stat
Kategorisiere Änderungen nach Keep-a-Changelog-Schema:
- Neu (
### Neu) — neue Features, neue Routen, neue Integrationen
- Geändert (
### Geändert) — veränderte Funktionalität, Updates
- Behoben (
### Behoben) — Bug Fixes
- Entfernt (
### Entfernt) — gelöschte Features
- Sicherheit (
### Sicherheit) — Security Fixes (immer zuerst)
- Abhängigkeiten (
### Abhängigkeiten) — reine Dependency-Updates (optional, bei vielen Renovate-Bumps zusammenfassen)
Schritt 3 — Eintrag in CHANGELOG.md einfügen
Format:
## [VERSION] — YYYY-MM-DD
### Neu
- Feature-Beschreibung aus Nutzerperspektive (kein technisches Jargon)
### Geändert
- Was hat sich verändert und warum ist es besser?
### Behoben
- Kurzbeschreibung des behobenen Fehlers
Regeln:
- Einträge aus Nutzerperspektive formulieren, nicht aus Entwicklerperspektive
- Keine Commit-SHAs, Branch-Namen oder internen Ticket-IDs im Changelog
- PR-Nummern als
(#123) am Zeilenende sind OK
## [Unreleased] bleibt immer erhalten — neue Einträge darunter wenn keine Version bekannt
- Bei bekannter Version: Versionsnummer aus
package.json übernehmen
Schritt 4 — App-Route sicherstellen
Prüfe ob src/app/changelog/page.tsx existiert. Falls nicht, erstelle sie:
import MarkdownRenderer from '@/components/markdown-renderer';
import fs from 'fs';
import Link from 'next/link';
import path from 'path';
export const metadata = {
title: 'Changelog — [APP NAME]',
};
export default function ChangelogPage() {
const changelog = fs.readFileSync(path.join(process.cwd(), 'CHANGELOG.md'), 'utf-8');
return (
<div className="min-h-screen bg-background px-4 py-12 sm:px-6 lg:px-8">
<div className="mx-auto max-w-3xl">
<Link href="/" className="text-sm text-muted-foreground hover:text-foreground">
← Zurück
</Link>
<h1 className="mt-4 mb-8 text-3xl font-bold">Changelog</h1>
<article className="rounded-xl border bg-card p-8 shadow-sm">
<MarkdownRenderer content={changelog} />
</article>
</div>
</div>
);
}
GitHub Action
Verwende skills/ai-first-webapp-gitops/templates/changelog-update.yml als Basis.
Das Template automatisiert Schritt 2–3 bei jedem PR-Merge auf main.