From 241576565e7097df5b1bbee99db10e7646067914 Mon Sep 17 00:00:00 2001 From: Chneemann Date: Sun, 2 Aug 2026 20:52:48 +0200 Subject: [PATCH] feat: add localized content and translations for about section --- src/components/About.tsx | 64 ++++++++++++++------------------------- src/i18n/messages/de.json | 13 ++++++++ src/i18n/messages/en.json | 13 ++++++++ 3 files changed, 48 insertions(+), 42 deletions(-) diff --git a/src/components/About.tsx b/src/components/About.tsx index f8deb28..9dbdb26 100644 --- a/src/components/About.tsx +++ b/src/components/About.tsx @@ -1,7 +1,14 @@ +"use client"; + +import { useTranslations } from "next-intl"; + /** * Section presenting personal background information, education, and key overview facts */ export default function About() { + const tCommon = useTranslations("Common"); + const tAbout = useTranslations("About"); + return (

- // 01. Introduction + // 01. {tAbout("sectionSub")}

- About me. + {tCommon("about")} + .

{/* Personal Bio Paragraphs */}
-

- Hey there! André here—a full-stack developer based in Karlsruhe. A - childhood fascination with computers sparked this journey, which has - since evolved into a true passion for software development. - {/* - German: - Hey! Hier ist André – ein Full-Stack-Entwickler aus Karlsruhe. - Eine Faszination für Computer seit meiner Kindheit hat diesen Weg geebnet, - der sich seitdem zu einer echten Leidenschaft für Softwareentwicklung entwickelt hat. - */} -

-

- Through my training at Developer Akademie, I gained hands-on - experience building real-world software, backed by rigorous code - reviews. This technical background has been put into practice and - expanded across a variety of solo and collaborative group projects. - {/* - German: - Während meiner Ausbildung an der Developer Akademie habe ich viel praktische - Erfahrung beim Bauen von echter Software gesammelt, unterstützt durch gründliche Code-Reviews. - Diesen technischen Hintergrund konnte ich in vielen eigenen Projekten sowie in - Gruppenprojekten direkt in die Praxis umsetzen und vertiefen. - */} -

-

- Feel free to explore my recent work below to see these skills and - problem-solving approaches in action. - {/* - German: - Schau dir gerne unten meine aktuellen Arbeiten an, um meine Fähigkeiten - und Lösungsansätze in Aktion zu sehen. - */} -

+

{tAbout("bio1")}

+

{tAbout("bio2")}

+

{tAbout("bio3")}

{/* Quick Facts Card */} @@ -71,7 +49,7 @@ export default function About() {

//{" "} - Quick Facts + {tAbout("quickFactsTitle")}

@@ -79,15 +57,17 @@ export default function About() {
  • ▸ - Languages: + + {tAbout("languagesLabel")}: + - German, English + {tAbout("languagesValue")}
  • ▸ - Core Stack: + {tAbout("stackLabel")}: Angular (TS), React (Next.js) @@ -96,10 +76,10 @@ export default function About() {
  • ▸ - Core Focus: + {tAbout("focusLabel")}: - Clean Code & Architecture + {tAbout("focusValue")}:
  • @@ -107,7 +87,7 @@ export default function About() { Status: - Available for projects + {tAbout("statusValue")}
diff --git a/src/i18n/messages/de.json b/src/i18n/messages/de.json index b40f583..58a59ff 100644 --- a/src/i18n/messages/de.json +++ b/src/i18n/messages/de.json @@ -14,5 +14,18 @@ "roleSuffix": "Entwickler", "description": "Ich konzipiere und entwickle moderne Web-Anwendungen. Mit einem klaren Auge fürs Detail und einem Fokus auf sauberen Code erwecke ich digitale Ideen zum Leben.", "downloadCv": "Lebenslauf" + }, + "About": { + "sectionSub": "Einführung", + "bio1": "Hey! Hier ist André – ein Full-Stack-Entwickler aus Karlsruhe. Eine Faszination für Computer seit meiner Kindheit hat diesen Weg geebnet, der sich seitdem zu einer echten Leidenschaft für Softwareentwicklung entwickelt hat.", + "bio2": "Während meiner Ausbildung an der Developer Akademie habe ich viel praktische Erfahrung beim Bauen von echter Software gesammelt, unterstützt durch gründliche Code-Reviews. Diesen technischen Hintergrund konnte ich in vielen eigenen Projekten sowie in Gruppenprojekten direkt in die Praxis umsetzen und vertiefen.", + "bio3": "Schau dir gerne unten meine aktuellen Arbeiten an, um meine Fähigkeiten und Lösungsansätze in Aktion zu sehen.", + "quickFactsTitle": "Auf einen Blick", + "languagesLabel": "Sprachen", + "languagesValue": "Deutsch, Englisch", + "stackLabel": "Technologien", + "focusLabel": "Schwerpunkt", + "focusValue": "Sauberer Code & Architektur", + "statusValue": "Verfügbar für Projekte" } } diff --git a/src/i18n/messages/en.json b/src/i18n/messages/en.json index 6e4f4fd..6f8e6d5 100644 --- a/src/i18n/messages/en.json +++ b/src/i18n/messages/en.json @@ -14,5 +14,18 @@ "roleSuffix": "Developer", "description": "I conceptualize and develop modern web applications. With a sharp eye for detail and a focus on clean code, I bring digital ideas to life.", "downloadCv": "Download CV" + }, + "About": { + "sectionSub": "Introduction", + "bio1": "Hey there! André here—a full-stack developer based in Karlsruhe. A childhood fascination with computers sparked this journey, which has since evolved into a true passion for software development.", + "bio2": "Through my training at Developer Akademie, I gained hands-on experience building real-world software, backed by rigorous code reviews. This technical background has been put into practice and expanded across a variety of solo and collaborative group projects.", + "bio3": "Feel free to explore my recent work below to see these skills and problem-solving approaches in action.", + "quickFactsTitle": "Quick Facts", + "languagesLabel": "Languages", + "languagesValue": "German, English", + "stackLabel": "Core Stack", + "focusLabel": "Core Focus", + "focusValue": "Clean Code & Architektur", + "statusValue": "Available for projects" } }