Update: 50 Jahre Code Timeline (1976-2026)

- Hero: Jahreszahl auf 1976-2026 (50 Jahre) aktualisiert
- About: Timeline von 1984 auf 1976 erweitert
- About: Neue Einträge für PC/DOS (1984), Web (1995), Server (2000er)
- System-Diagramm: Halbkreis-Layout statt vertikaler Anordnung
- Metadaten: Description angepasst

app/layout.tsx

@@ -24,7 +24,7 @@ const jetbrainsMono = JetBrains_Mono({
 
 export const metadata: Metadata = {
   title: 'Jamulix | 40 Jahre Code',
-  description: 'Seit 40 Jahren Code. Von Fortran IV bis KI-Projekte in Python und Rust. Erfahrener Programmierer, Linux-Veteran und KI-Entwickler.',
+  description: 'Seit 40 Jahren Code. Von Fortran IV bis Python, Rust und KI-Projekten. Erfahrener Programmierer, Linux-Veteran und KI-Entwickler.',
   keywords: ['Programmierung', 'Linux', 'KI', 'Python', 'Rust', 'Software-Entwicklung', 'AI', 'Fortran', 'Unix'],
   authors: [{ name: 'Jamulix' }],
   creator: 'Jamulix',
@@ -34,12 +34,12 @@ export const metadata: Metadata = {
     url: 'https://jamulix.de',
     siteName: 'Jamulix',
     title: 'Jamulix | 40 Jahre Code',
-    description: 'Seit 40 Jahren Code. Von Fortran IV bis KI-Projekte in Python und Rust.',
+    description: 'Seit 40 Jahren Code. Von Fortran IV bis Python, Rust und KI-Projekten.',
   },
   twitter: {
     card: 'summary_large_image',
     title: 'Jamulix | 40 Jahre Code',
-    description: 'Seit 40 Jahren Code. Von Fortran IV bis KI-Projekte in Python und Rust.',
+    description: 'Seit 40 Jahren Code. Von Fortran IV bis Python, Rust und KI-Projekten.',
   },
   robots: {
     index: true,

components/about-section.tsx

@@ -4,34 +4,46 @@ import { motion } from 'framer-motion'
 
 const timeline = [
   {
-    era: '1984',
+    era: '1976',
     title: 'Der Anfang',
-    description: 'Erste Programme in Fortran IV. Lochkarten, Großrechner, Batch-Verarbeitung. Die Grundlagen des algorithmischen Denkens.',
+    description: 'Erste Programme in Fortran IV. Lochkarten, Großrechner, Batch-Verarbeitung. Erste Programmierkurse im Rahmen des VWL-Studiums. Die Grundlagen des algorithmischen Denkens.',
     tech: ['Fortran IV'],
   },
+  {
+    era: '1984',
+    title: 'Der erste PC',
+    description: 'Erste Programme in Basic, C und Pascal auf dem Personal Computer unter DOS. Datenbanken, Textverarbeitung, Spiele.',
+    tech: ['Lotus 1-2-3', 'dBASE', 'QBasic', 'Turbo Pascal', 'Norton Commander', 'WordPerfect'],
+  },
   {
     era: '1986',
     title: 'Systemnahe Programmierung',
-    description: 'C und 68000-Assembler auf dem Atari ST. Direkte Hardware-Ansteuerung, Interrupt-Routinen, Speicherverwaltung von Hand.',
+    description: 'C und 68000-Assembler auf dem Atari ST. Direkte Hardware-Ansteuerung, Interrupt-Routinen, Speicherverwaltung von Hand. Pseudo-Multitasking. DFÜ mit Akustikkoppler. Maiboxen, FidoNet, MausNet.',
-    tech: ['C', '68000 ASM', 'GFA Basic'],
+    tech: ['C', '68000 ASM', 'GFA Basic', 'TOS'],
   },
   {
     era: '1990',
     title: 'Unix an der Universität',
-    description: 'SunOS, HP-UX, BSD. Die Philosophie kleiner, zusammenarbeitender Programme. Shell-Scripting als Werkzeug.',
+    description: 'AIX, HP-UX, BSD. Die Philosophie kleiner, zusammenarbeitender Programme. Shell-Scripting als Werkzeug. Internet. Sysop-Aufgaben im Uni-Rechenzentrum.',
-    tech: ['Unix', 'Shell', 'vi'],
+    tech: ['Unix', 'Shell', 'vi', 'Gopher'],
   },
   {
-    era: '1994',
+    era: '1992',
     title: 'Linux entdeckt',
-    description: 'Slackware auf 40 Disketten. Der Beginn einer dauerhaften Begeisterung für offene Systeme und Selbstbestimmung.',
+    description: 'Slackware auf 40 Disketten, Debian, SUSE Linux ... Der Beginn einer dauerhaften Begeisterung für offene Systeme und Selbstbestimmung. C, C++, Pascal, Modula, Perl, Shell-Skript. Internet per Modem. Pentesting, Hacking.',
     tech: ['Linux', 'GNU Tools', 'X11'],
   },
+  {
+    era: '1995 ff.',
+    title: 'World Wide Web',
+    description: 'Permanenter privater Internet-Zugang kommerzieller Anbieter und erste eigene Domain: linix.de. World Wide Web. Eigene Webseiten in HTML und JavaScript programmiert.',
+    tech: ['WWW', 'Netscape', 'HTML', 'Java', 'JavaScript', 'Modem'],
+  },
   {
     era: '2000er',
     title: 'Professionelle Entwicklung',
-    description: 'Verschiedene Sprachen, verschiedene Domänen. Server-Administration, Automatisierung, Web-Entwicklung.',
+    description: 'Verschiedene Sprachen, verschiedene Domänen. Server-Administration, Automatisierung, Web-Entwicklung. Systemadministration, Networking, Linux-Server und vHosts im Netz und lokal, Selfhosting, Internet-Programmierung, APIs, Nachrichten-Scraping, automatische und dynamische Webseiten Generierung, Container, Virtuelle Maschinen, Hypervisor, Automaten, Toolchains, Browser-Fernsteuerung. — Alles unter Linux. Einplatinen Computer, Microcontroller.',
-    tech: ['Perl', 'PHP', 'Bash', 'Python'],
+    tech: ['Perl', 'PHP', 'Bash', 'Python', 'Go', 'Raspberry Pi', 'Arduino', 'ESP32', 'Proxmox', 'Yunohost', 'Jamulus', 'Jitsi', 'Selenium/Playwright', 'Docker/Podman'],
   },
   {
     era: '2022',
@@ -57,11 +69,11 @@ export function AboutSection() {
             Hintergrund
           </span>
           <h2 className="font-serif text-3xl sm:text-4xl lg:text-5xl mt-4 text-balance">
-            Vier Jahrzehnte Programmierung
+            Fünf Jahrzehnte Programmierung
           </h2>
           <p className="mt-6 text-lg text-muted-foreground max-w-2xl">
             Eine Reise durch die Evolution der Software-Entwicklung – 
-            von Lochkarten bis zu Large Language Models.
+            von Lochkarten bis zu Large Language Models, Vibe-Coding und agentischen KI‑Systemen.
           </p>
         </motion.div>
 

components/footer.tsx

@@ -44,7 +44,7 @@ export function Footer() {
                 Jamulix
               </Link>
               <p className="mt-4 text-muted-foreground max-w-sm leading-relaxed">
-                40 Jahre Programmierung. Von Fortran bis KI. 
+                50 Jahre Programmierung. Von Fortran bis KI. 
                 Linux-Enthusiast seit 1994. Aktuell Python und Rust.
               </p>
               

components/hero.tsx

@@ -33,11 +33,11 @@ export function Hero() {
               transition={{ duration: 0.6 }}
             >
               <span className="inline-block font-mono text-xs tracking-wider text-accent uppercase mb-6">
-                1984 – heute
+                1976 – heute
               </span>
               
               <h1 className="font-serif text-4xl sm:text-5xl lg:text-6xl xl:text-7xl leading-[1.1] tracking-tight text-balance">
-                Seit 40 Jahren Code. Von Fortran{'\u00A0'}IV bis KI-Projekte in Python und Rust.
+                Seit 50 Jahren Code. Von Fortran{'\u00A0'}IV bis KI-Projekte in Python und Rust.
               </h1>
             </motion.div>
 

components/system-diagram.tsx

@@ -3,25 +3,40 @@
 import { motion } from 'framer-motion'
 
 const nodes = [
-  { id: 'fortran', label: 'Fortran IV', x: 20, y: 15, era: '1984' },
+  // Halbkreis-Layout: folgt der Timeline von links → rechts in sanftem Bogen
-  { id: 'c', label: 'C', x: 45, y: 25, era: '1986' },
+  // 1970s-80s (oberer linker Bogen)
-  { id: 'asm', label: '68K ASM', x: 75, y: 20, era: '1987' },
+  { id: 'fortran', label: 'Fortran IV', x: 15, y: 25, era: '1976' },
-  { id: 'unix', label: 'Unix', x: 30, y: 45, era: '1990' },
+  { id: 'pc', label: 'PC/DOS', x: 28, y: 18, era: '1984' },
-  { id: 'linux', label: 'Linux', x: 60, y: 50, era: '1994' },
+  { id: 'c', label: 'C', x: 42, y: 15, era: '1986' },
-  { id: 'python', label: 'Python', x: 25, y: 75, era: '2020' },
+  { id: 'asm', label: '68K ASM', x: 58, y: 18, era: '1986' },
-  { id: 'rust', label: 'Rust', x: 55, y: 80, era: '2022' },
+  
-  { id: 'ai', label: 'KI', x: 80, y: 70, era: '2023' },
+  // 1990s (oberer rechter Bogen)
+  { id: 'unix', label: 'Unix', x: 70, y: 28, era: '1990' },
+  { id: 'linux', label: 'Linux', x: 78, y: 42, era: '1992' },
+  { id: 'web', label: 'WWW', x: 82, y: 58, era: '1995' },
+  
+  // 2000s-2020s (unterer Bereich, nach links zurück)
+  { id: 'server', label: 'Server', x: 65, y: 75, era: '2000er' },
+  { id: 'python', label: 'Python', x: 45, y: 82, era: '2000er' },
+  { id: 'rust', label: 'Rust', x: 28, y: 78, era: '2022' },
+  { id: 'ai', label: 'KI', x: 18, y: 68, era: '2022' },
 ]
 
 const connections = [
-  ['fortran', 'c'],
+  // Hauptfluss der Timeline (äußerer Ring)
+  ['fortran', 'pc'],
+  ['pc', 'c'],
   ['c', 'asm'],
-  ['c', 'unix'],
   ['unix', 'linux'],
-  ['linux', 'python'],
+  ['linux', 'web'],
-  ['linux', 'rust'],
+  ['web', 'server'],
-  ['python', 'ai'],
+  ['server', 'python'],
+  ['python', 'rust'],
   ['rust', 'ai'],
+  
+  // Verbindungslinien (innere Verästelungen)
+  ['c', 'unix'],    // C beeinflusst Unix
+  ['python', 'ai'], // Python → KI
 ]
 
 export function SystemDiagram() {