Wie ich mit Claude Code eine mehrsprachige Website erstellt habe

Der Kontext

Ich bin Auszubildender zum Digital Business Developer bei CHUV in Sion. Meine Aufgabe ist es, geschäftliche Anforderungen zu verstehen und die richtigen technischen Lösungen zu finden. Kein Programmieren 8 Stunden am Tag in einer IDE.

Als ich meine Portfolio-Site erstellen wollte, hatte ich zwei Möglichkeiten: eine WordPress-Vorlage oder etwas wirklich Maßgeschneidertes. Den zweiten habe ich übernommen, mit Claude Code als technischem Partner.

Der wichtigste Punkt dieses Artikels lässt sich in einem Satz zusammenfassen: Ohne meine Computerkenntnisse hätte es nie geklappt.

Was ich beherrschen musste, BEVOR ich KI berührte

Bevor ich Claude Code etwas fragte, hatte ich mich monatelang darin geschult:

• DNS und Domainnamen: Verstehen Sie, wie „davidmerki.ch“ auf einen Server verweist, A-Einträge, CNAME, Weitergabe
• Webhosting: CloudPanel, SSH, SCP, Dateiberechtigungen, SSL-Zertifikate
• Sicherheit: HTTPS, Sicherheitsheader, Injektionsschutz, OWASP-Best Practices
• Datenschutz: die LPD (Schweizer Recht) und die europäische RGPD und was dies konkret für ein Kontaktformular, ein Analyse-Cookie oder einen Kalender bedeutet
• Webarchitektur: Der Unterschied zwischen einer statischen und einer dynamischen Site, warum Hugo, wie ein Build, eine Bereitstellung funktioniert

Ohne diese Grundlagen hätte ich Claude bitten können, technisch perfekten Code zu generieren und trotzdem eine Website zu veröffentlichen, die unsicher, nicht konform oder unmöglich zu warten war.

Warum Hugo + Claude Code

Hugo ist ein superschneller statischer Site-Generator. Keine Datenbank, kein komplexer PHP-Server, nahezu sofortige Ladezeiten. Andererseits ist die Lernkurve steil, wenn Sie Go-Vorlagen nicht kennen.

Claude Code hat mir geholfen, diese Kurve zu überwinden. Mein workflow sieht so aus:

1. Ich beschreibe das gewünschte Ergebnis auf Französisch mit meinen eigenen Worten
2. Claude analysiert den vorhandenen Code und schlägt einen Ansatz vor
3. Ich validiere den Ansatz, weil ich die Architektur verstehe
4. Claude implementiert den vollständigen Code
5. Ich teste und überprüfe, ob alles korrekt ist: Sicherheit, Zugänglichkeit, Leistung
6. Wir iterieren, bis es sauber ist

Schritt 3 ist der Schlüssel. Wenn ich nicht verstand, was Claude mir anbot, könnte ich es nicht bestätigen. Und da machen die meisten Menschen einen Fehler.

6 Sprachen, davon 2 RTL

Die Website unterstützt 6 Sprachen: Französisch, Deutsch, Arabisch, Russisch, Chinesisch und Hebräisch. Arabisch und Hebräisch werden von rechts nach links (RTL) geschrieben, was das gesamte Layout stört.

Für die Übersetzungen habe ich mit Claude ein Python-Skript erstellt, das den Quell-Markdown auf Französisch liest, die YAML-Titelseite und das HTML beibehält, über die API DeepL übersetzt wird (mit Google Translate in Relief) und ein schützt Glossar mit 52 Begriffen, hauptsächlich Eigennamen und Akronyme.

Das Ergebnis: ~57 automatisch übersetzte Markdown-Dateien. Aber auch hier musste ich verstehen, wie die API, Kontingente, Fallbacks und das i18n-System von Hugo funktionierten, damit alles richtig zusammenpasste.

Das Reservierungssystem

Der größte Teil ist ein vollständiges Reservierungssystem, das in die statische Site integriert ist.

• Interaktiver Kalender mit monatlicher Navigation
• 30-Minuten-Slots, Montag bis Freitag, 9.00 bis 19.00 Uhr.
• Synchronisierung mit meinem Kalender Outlook (ICS + RRULE-Analyse)
• Validierung von Formularen in Echtzeit
• ~900 Zeilen JavaScript

Claude Code hat alles generiert, einschließlich PHP-Backend. Aber ich war es, der das CORS konfigurieren, den Endpunkt mit einem Token sichern, das PHP auf CloudPanel bereitstellen und prüfen musste, ob die ICS-Analyse die Schweizer Zeitzonen korrekt verarbeitet.

Die Zahlen

Die Werkzeuge, die ich verwende

Ich mache kein Geheimnis daraus: Ich nutze künstliche Intelligenz täglich. Hauptsächlich zwei Tools:

• Claude (Anthropic) für alle meine technischen Projekte. Claude Code im CLI für Entwicklung, Claude im Gespräch für Reflexion und Architektur. Es ist mein Hauptwerkzeug.
• Euria für den Rest: Schreiben, Recherchieren, alltägliche Fragen. Es handelt sich um eine europäische KI, ein Plus für den Respekt vor Daten.

Jedes Werkzeug hat seine Stärken. Ich habe keine blinde Loyalität, sondern nehme, was je nach Situation am besten funktioniert.

Was ich anders gemacht hätte

1. Beginnen Sie mit Mobilgeräten. Ich habe zuerst den Desktop entworfen und ihn dann angepasst. das Gegenteil wäre effektiver gewesen.
2. Beschränken Sie die Animationen. 12 Module sind zu viel. Vier oder fünf gut ausgewählte hätten gereicht.
3. Strukturieren Sie Übersetzungen von Anfang an. Ich habe die Sprachen nachträglich hinzugefügt, wodurch Fehler entstanden sind.
4. Richten Sie ab Tag 1 eine CLAUDE.md ein. Diese Konfigurationsdatei für Claude Code ändert alles.

Die wahre Botschaft

KI beschleunigt die technische Arbeit enorm. Keine stundenlangen Dokumentationen, Stapelüberläufe und Syntax-Debugging mehr. Es ist ein fantastisches Werkzeug.

Aber es ersetzt nicht das Verständnis. KI hat kein Bewusstsein und keinen Überblick. Sie weiß nicht, dass Ihr SSL-Zertifikat in drei Tagen abläuft, dass Ihr Kontaktformular nicht der LPD entspricht oder dass Ihr Hosting über kein Backup verfügt.

Sie brauchen einen Menschen, der die Informatik dahinter versteht. Jemand, der bei Bedarf ins Detail gehen kann, neugierig ist und das „Warum“ und nicht nur das „Wie“ verstehen möchte.

Das ist meine Aufgabe als Digital Business Developer: Den Überblick zu behalten und bei Bedarf in die Technologie einzutauchen.

Suchen Sie jemanden, der sowohl Wirtschaft als auch Technologie versteht? Kostenlose Beratung buchen zum Besprechen.