dschlueter/jamulix-homepage
Watch
1
0
Fork
You've already forked jamulix-homepage
 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Feature: Fehlerseiten 401, 403, 500, 502, 503, 504

Browse source 
Gemeinsames Layout in components/error-page.tsx, 404 darauf umgestellt.
Jede Route app/<code>/page.tsx erzeugt landingpage/<code>.html; die
Deploy-Skripte kopieren alle Fehlerseiten in den Webroot. README
dokumentiert die nötigen ErrorDocument-Zeilen (Server-Konfig unverändert).

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
Dieter Schlüter 2026-10-07 09:55:02 +02:00
commit 9c7e1ce4db
7 changed files with 427 additions and 120 deletions
Download patch file Download diff file Expand all files Collapse all files

37
app/401/page.tsx Normal file
View file

@ -0,0 +1,37 @@
import { ErrorPage, Cmd, Out, Err } from '@/components/error-page'
export const metadata = {
title: '401 – Autorisierung erforderlich | Jamulix',
description: 'Parole? Dieser Bereich ist passwortgeschützt.',
robots: { index: false, follow: false },
}
export default function Unauthorized() {
return (
<ErrorPage
code={401}
label="Autorisierung erforderlich"
title="Parole?"
terminal={
<>
<Cmd>ssh gast@jamulix.de</Cmd>
<Err>gast@jamulix.de: Permission denied (publickey,password).</Err>
<Cmd>sudo !!</Cmd>
<Out>[sudo] Passwort für gast: ********</Out>
<Out>Sorry, try again.</Out>
<Out>[sudo] Passwort für gast: geheim</Out>
<Out>Sorry, try again.</Out>
<Out>[sudo] Passwort für gast: 123456</Out>
<Err>sudo: 3 incorrect password attempts</Err>
<Cmd>echo &quot;Sesam, öffne dich&quot;</Cmd>
<Out>Sesam, öffne dich</Out>
</>
}
tip={<>Tipp: <span className="text-accent">123456</span> ist es auch diesmal nicht.</>}
>
Dieser Bereich ist passwortgeschützt. Wer Zugangsdaten hat, lädt die
Seite einfach neu und meldet sich an – alle anderen bekommen immerhin
diese hübsche Fehlerseite.
</ErrorPage>
)
}

35
app/403/page.tsx Normal file
View file

@ -0,0 +1,35 @@
import { ErrorPage, Cmd, Out, Err } from '@/components/error-page'
import { RequestedPath } from '@/components/requested-path'
export const metadata = {
title: '403 – Zugriff verweigert | Jamulix',
description: 'Hier gilt chmod 000.',
robots: { index: false, follow: false },
}
export default function Forbidden() {
return (
<ErrorPage
code={403}
label="Zugriff verweigert"
title="Hier gilt chmod 000."
terminal={
<>
<Cmd>ls -l <RequestedPath /></Cmd>
<Err>ls: Zugriff auf &apos;<RequestedPath />&apos; nicht möglich: Keine Berechtigung</Err>
<Cmd>chmod 777 <RequestedPath /></Cmd>
<Err>chmod: Ändern der Zugriffsrechte nicht möglich: Operation nicht erlaubt</Err>
<Cmd>sudo chmod 777 <RequestedPath /></Cmd>
<Err>gast ist nicht in der sudoers-Datei. Dieser Vorfall wird gemeldet.</Err>
<Cmd>whoami</Cmd>
<Out>gast</Out>
</>
}
tip={<>Tipp: Auch root war einmal <span className="text-accent">gast</span>.</>}
>
Die Seite gibt es – nur eben nicht für dich. Manche Verzeichnisse
bleiben aus gutem Grund verschlossen, selbst nach 50 Jahren
Unix-Erfahrung und mit freundlichem Fragen.
</ErrorPage>
)
}

34
app/500/page.tsx Normal file
View file

@ -0,0 +1,34 @@
import { ErrorPage, Cmd, Out, Err, Code } from '@/components/error-page'
export const metadata = {
title: '500 – Interner Serverfehler | Jamulix',
description: 'Der Server hat sich verschluckt.',
robots: { index: false, follow: false },
}
export default function InternalServerError() {
return (
<ErrorPage
code={500}
label="Interner Serverfehler"
title="Der Server hat sich verschluckt."
terminal={
<>
<Cmd>./server --seite-ausliefern</Cmd>
<Err>Segmentation fault (core dumped)</Err>
<Cmd>gdb ./server core</Cmd>
<Out>#0 0x00000000 in ?? ()</Out>
<Out>#1 0x0000dead in seite_ausliefern (zeiger=NULL)</Out>
<Cmd>cat notfall.f</Cmd>
<Out>C WENN ALLES SCHIEFGEHT:</Out>
<Code> STOP 500</Code>
</>
}
tip={<>Tipp: Kurz warten, dann <span className="text-accent">F5</span> – das hilft öfter, als man denkt.</>}
>
Irgendwo im Maschinenraum ist ein Zeiger ins Leere gelaufen. Das ist
nicht deine Schuld. Der Fehler wird untersucht – vermutlich bei einer
Tasse Tee.
</ErrorPage>
)
}

33
app/502/page.tsx Normal file
View file

@ -0,0 +1,33 @@
import { ErrorPage, Cmd, Out, Err } from '@/components/error-page'
export const metadata = {
title: '502 – Bad Gateway | Jamulix',
description: 'Der Server hinter dem Server schweigt.',
robots: { index: false, follow: false },
}
export default function BadGateway() {
return (
<ErrorPage
code={502}
label="Bad Gateway"
title="Der Server hinter dem Server schweigt."
terminal={
<>
<Cmd>ping -c 3 backend</Cmd>
<Out>--- backend ping statistics ---</Out>
<Err>3 packets transmitted, 0 received, 100% packet loss</Err>
<Cmd>curl http://localhost:8080/</Cmd>
<Err>curl: (7) Failed to connect to localhost port 8080: Connection refused</Err>
<Cmd>echo &quot;Hallo? Jemand da?&quot; &gt; /dev/backend</Cmd>
<Out>…</Out>
</>
}
tip={<>Tipp: Der Dienst startet meist von selbst neu – in ein paar Minuten nochmal versuchen.</>}
>
Der Webserver ist da und hat brav weitergefragt – aber die Anwendung
dahinter antwortet gerade nicht. Wahrscheinlich startet sie neu oder
denkt über ihr Leben nach.
</ErrorPage>
)
}

31
app/503/page.tsx Normal file
View file

@ -0,0 +1,31 @@
import { ErrorPage, Cmd, Out, Code } from '@/components/error-page'
export const metadata = {
title: '503 – Wartungsarbeiten | Jamulix',
description: 'Der Server macht gerade Teepause.',
robots: { index: false, follow: false },
}
export default function ServiceUnavailable() {
return (
<ErrorPage
code={503}
label="Wartungsarbeiten"
title="Der Server macht gerade Teepause."
terminal={
<>
<Cmd>systemctl status jamulix</Cmd>
<Out>● jamulix.service – Jamulix Webdienst</Out>
<Code> Active: maintenance (Teepause) since vorhin</Code>
<Out> Tasks: 1 (Wasser kocht)</Out>
<Cmd>sleep 300 &amp;&amp; tee tasse.txt &lt; kanne</Cmd>
<Out>Earl Grey, heiß.</Out>
</>
}
tip={<>Tipp: Ein guter Tee zieht 3–5 Minuten – genau wie diese Wartung.</>}
>
Hier wird gerade gewartet, aktualisiert und ein wenig aufgeräumt.
Gleich ist alles wieder da – frisch gepatcht und gut gelaunt.
</ErrorPage>
)
}

32
app/504/page.tsx Normal file
View file

@ -0,0 +1,32 @@
import { ErrorPage, Cmd, Out, Err, Code } from '@/components/error-page'
export const metadata = {
title: '504 – Gateway Timeout | Jamulix',
description: 'Der Server denkt noch nach.',
robots: { index: false, follow: false },
}
export default function GatewayTimeout() {
return (
<ErrorPage
code={504}
label="Gateway Timeout"
title="Der Server denkt noch nach."
terminal={
<>
<Cmd>curl --max-time 60 http://backend/</Cmd>
<Err>curl: (28) Operation timed out after 60000 milliseconds</Err>
<Cmd>cat jobkarte.jcl</Cmd>
<Code>//JOB504 JOB (1976),&apos;SEITE&apos;,CLASS=A</Code>
<Out>JOB 504 IN WARTESCHLANGE – POSITION 42</Out>
<Out>VORAUSSICHTLICHE AUSGABE: MORGEN FRÜH AM SCHALTER</Out>
</>
}
tip={<>Tipp: 1976 kam das Ergebnis am nächsten Morgen – heute reicht meist ein Neuladen.</>}
>
Die Anwendung hinter dem Webserver braucht gerade länger als erlaubt.
Früher gab man seinen Lochkartenstapel ab und holte das Ergebnis am
nächsten Tag – so lange musst du hoffentlich nicht warten.
</ErrorPage>
)
}

139
app/not-found.tsx
View file

@ -1,6 +1,4 @@
import Link from 'next/link'
import { ArrowLeft, FolderGit2 } from 'lucide-react'
import { Button } from '@/components/ui/button'
import { ErrorPage, Cmd, Out, Err, Code } from '@/components/error-page'
import { RequestedPath } from '@/components/requested-path'
export const metadata = {
@ -11,117 +9,28 @@ export const metadata = {
export default function NotFound() {
return (
<main className="relative min-h-screen flex flex-col overflow-hidden">
{/* Fly.io-style gradient mesh background (dark mode only) */}
<div className="absolute inset-0 bg-gradient-mesh hidden dark:block" />
{/* Subtle grid overlay */}
<div
className="absolute inset-0 opacity-[0.02] dark:opacity-[0.04]"
style={{
backgroundImage: `
linear-gradient(to right, currentColor 1px, transparent 1px),
linear-gradient(to bottom, currentColor 1px, transparent 1px)
`,
backgroundSize: '60px 60px',
}}
/>
{/* Logo */}
<div className="relative max-w-6xl w-full mx-auto px-6 lg:px-8">
<div className="flex items-center h-16 lg:h-20">
<Link
href="/"
className="font-mono text-lg tracking-tight text-foreground hover:text-accent transition-colors"
>
Jamulix
</Link>
</div>
</div>
<div className="relative flex-1 flex items-center">
<div className="max-w-6xl w-full mx-auto px-6 lg:px-8 py-12 lg:py-20">
<div className="grid lg:grid-cols-12 gap-12 lg:gap-16 items-center">
{/* Text Content */}
<div className="lg:col-span-6 space-y-8">
<div>
<span className="inline-block font-mono text-xs tracking-wider text-accent uppercase mb-4">
Fehler 404 · Seite nicht gefunden
</span>
<p
aria-hidden="true"
className="font-serif font-bold text-8xl sm:text-9xl leading-none tracking-tighter text-foreground/90 dark:bg-gradient-to-r dark:from-cyan-400 dark:to-violet-400 dark:bg-clip-text dark:text-transparent"
>
404
</p>
<h1 className="mt-6 font-serif text-3xl sm:text-4xl lg:text-5xl leading-[1.1] tracking-tight text-balance">
Diese Seite ist vom Lochkartenstapel gefallen.
</h1>
</div>
<p className="text-lg text-muted-foreground leading-relaxed max-w-xl">
Seit 50 Jahren Code – und trotzdem verlegt man gelegentlich
etwas. Die gesuchte Seite existiert nicht, nicht mehr oder
noch nicht. Vielleicht war auch nur ein übereifriges{' '}
<code className="font-mono text-sm text-accent">rm -rf</code>{' '}
am Werk.
</p>
<div className="flex flex-col sm:flex-row gap-4">
<Button asChild size="lg" className="group">
<Link href="/">
<ArrowLeft className="mr-2 size-4 transition-transform group-hover:-translate-x-0.5" />
cd ~ — Zur Startseite
</Link>
</Button>
<Button asChild variant="outline" size="lg" className="group">
<Link href="/#projekte">
<FolderGit2 className="mr-2 size-4" />
Projekte ansehen
</Link>
</Button>
</div>
</div>
{/* Terminal */}
<div className="lg:col-span-6">
<div className="rounded-lg border border-border bg-card shadow-xl dark:shadow-[0_0_40px_oklch(0.70_0.22_280/0.3)] overflow-hidden">
<div className="flex items-center gap-2 px-4 py-3 border-b border-border bg-muted/50">
<span className="size-3 rounded-full bg-red-500/80" />
<span className="size-3 rounded-full bg-yellow-500/80" />
<span className="size-3 rounded-full bg-green-500/80" />
<span className="ml-3 font-mono text-xs text-muted-foreground">
jamulix@jamulix.de: ~
</span>
</div>
<pre className="p-5 sm:p-6 font-mono text-xs sm:text-sm leading-relaxed whitespace-pre-wrap text-card-foreground">
<span className="text-accent">$</span> cd <RequestedPath />{'\n'}
<span className="text-muted-foreground">
bash: cd: <RequestedPath />: Datei oder Verzeichnis nicht gefunden
</span>{'\n'}
<span className="text-accent">$</span> find / -name &quot;seite&quot; 2&gt;/dev/null{'\n'}
<span className="text-accent">$</span> cat seite.f{'\n'}
<span className="text-muted-foreground">C GESTANZT 1976 – STAPEL LEIDER RUNTERGEFALLEN</span>{'\n'}
<span className="text-cyan-600 dark:text-cyan-400"> GO TO 404</span>{'\n'}
<span className="text-accent">$</span> sudo !!{'\n'}
<span className="text-destructive dark:text-red-400">
jamulix ist nicht in der sudoers-Datei. Dieser Vorfall wird gemeldet.
</span>{'\n'}
<span className="text-accent">$</span>{' '}
<span className="inline-block w-2 h-4 align-middle bg-foreground animate-pulse" />
</pre>
</div>
<p className="mt-4 font-mono text-xs text-muted-foreground text-center lg:text-left">
Tipp: Auch nach 50 Jahren hilft <span className="text-accent">ls</span> meistens weiter.
</p>
</div>
</div>
</div>
</div>
</main>
<ErrorPage
code={404}
label="Seite nicht gefunden"
title="Diese Seite ist vom Lochkartenstapel gefallen."
terminal={
<>
<Cmd>cd <RequestedPath /></Cmd>
<Out>bash: cd: <RequestedPath />: Datei oder Verzeichnis nicht gefunden</Out>
<Cmd>find / -name &quot;seite&quot; 2&gt;/dev/null</Cmd>
<Cmd>cat seite.f</Cmd>
<Out>C GESTANZT 1976 – STAPEL LEIDER RUNTERGEFALLEN</Out>
<Code> GO TO 404</Code>
<Cmd>sudo !!</Cmd>
<Err>jamulix ist nicht in der sudoers-Datei. Dieser Vorfall wird gemeldet.</Err>
</>
}
tip={<>Tipp: Auch nach 50 Jahren hilft <span className="text-accent">ls</span> meistens weiter.</>}
>
Seit 50 Jahren Code – und trotzdem verlegt man gelegentlich etwas.
Die gesuchte Seite existiert nicht, nicht mehr oder noch nicht.
Vielleicht war auch nur ein übereifriges{' '}
<code className="font-mono text-sm text-accent">rm -rf</code> am Werk.
</ErrorPage>
)
}