Über WebDev Tools

Ja, ich weiß. Die 10.000ste Toolsammlung im Internet. Wer braucht die schon? Aber ich kann euch beruhigen: Dieses Projekt war nie geplant. Es ist ein Unfall, ein Produkt der Prokrastination und eine Lektion im Umgang mit künstlicher Intelligenz.

Alles begann ganz harmlos auf meinem Desktop.

Am Anfang war das Skript.

Wie viele Entwickler hatte auch ich einige eigene Tools auf meinem Localhost gespeichert. Kleine Skripte für alltägliche Ärgernisse – eine Em/Px-Umrechnung hier, ein kleiner Helfer dort. Dinge, für die ich zu faul war, immer wieder die gleichen Websites zu suchen und aufzurufen. Mit Lesezeichen stehe ich nämlich auf absolutem Kriegsfuß.

Diese kleinen Helferlein taten ihren Dienst. Doch dann fügte ich zwei weitere hinzu. Und dann passierte es: Mein Webentwickler-Instinkt schlug zu.

Instinktiv begann ich, die Dinger miteinander zu verknüpfen. Ein Menü musste her. Und ein bisschen Styling. Und alles, was einem sonst noch so in den Sinn kommt, wenn man sich erfolgreich von der eigentlichen Arbeit ablenken möchte. So wurde aus einer einfachen Scriptsammlung ein ausgewachsenes Projekt. Ich musste es einfach „pimpen”, bis ich eine richtige kleine Website mit allem Drum und Dran fertig hatte.

„KI, übernimm mal!” – Eine Schnapsidee?

Irgendwann kam mir der Gedanke: Es sind ja nur einfache Skripte. Lass das doch mal die KI machen! Als treuer Nutzer von VS Code habe ich das Projekt direkt mit Claude Sonnet 4.5 (im GitHub CoPilot) aufgesetzt.

Ich war überrascht, denn das Ergebnis war eine erstaunlich gute, modular erweiterbare Webanwendung.

Natürlich war es nicht so einfach. Man muss die KI permanent davon abhalten, zu übertreiben. Mein wichtigstes Kommando wurde schnell: „Nein, wir brauchen keinen Paketmanager! Und jetzt hör auf, mir noch ein Framework vorschlagen zu wollen!”

Am Ende kam aber tatsächlich ein brauchbares Grundgerüst heraus.

Die Tücken des „Vibe Coding” mit KI

Das Projekt nahm Fahrt auf und ich lernte schnell ein paar harte Lektionen über die Zusammenarbeit mit meinen neuen digitalen Kollegen.

Die Framework-Frage: KIs arbeiten vorzugsweise mit Tailwind. Das taten sie auch hier. Nach einigen manuellen Anpassungen, bei denen mein Geduldsfaden immer dünner wurde, riss er schließlich. Ich bin kurzerhand auf Bootstrap umgestiegen, um die Sammlung schnell und pragmatisch zu einem Ende zu führen. Manchmal ist „fertig" einfach besser als „perfekt" (oder „Tailwind").

2. Ohne Git? Ohne mich! Aus reiner Gewohnheit habe ich direkt ein Git-Repository angelegt. Zum Glück! Ich habe schnell gemerkt, dass das, was ich da tat – dieses planlose „Vibe Coding" mit der KI – ohne Git zu einer erheblichen Zeitverschwendung führt.

3. Die Tücken der KI-Logik: Das größte Problem ist, dass KIs sich das Leben gerne leicht machen, aber auf die falsche Art.

• Sie spekulieren: Anstatt zu analysieren, was man eigentlich vorhat, raten sie oft wild drauf los. Dieses Spekulieren muss man ganz schnell unterbinden und ihnen jeden Schritt präzise vorgeben, sonst endet es im Chaos.
• Sie lieben eigene Scripts. Sie neigen dazu, eigene Skripte oder Lösungen vorzuschlagen, die oft zu verheerenden Ergebnissen führen. In nicht wenigen Fällen wäre dadurch ein kompletter Neustart des Projekts erforderlich gewesen, wäre da nicht ein beherztes „git reset --hard” möglich gewesen.

4. KI-Ping-Pong bei Code-Reviews Auch bei der Qualitätssicherung habe ich auf die KIs gesetzt, aber mit System: Zünächst habe ich die Code-Reviews von GPT-5 Codex durchführen lassen und anschließend die Meinung von Claude Sonnet 4.5 dazu eingeholt. Ein KI-Review für das KI-Review sozusagen. Das ist ziemlich meta, aber extrem nützlich, um verschiedene „Denkweisen" gegenzuprüfen.

Bonusrunde: KI als Übersetzer?

Nachdem die Funktionalität stand, dachte ich an Übersetzungen. Zuerst durfte Claude Sonnet 4.5 ran. Laut eigener Aussage beherrscht die KI Englisch und Deutsch auf Muttersprachniveau und liefert bei Spanisch, Französisch, Italienisch und Portugiesisch eine Sicherheit von 98 %.

Es wurde interessant, als ich nach Hindi, Chinesisch oder Japanisch fragte. Hier gab die KI zu, dass sie hierfür externe Hilfe wie DeepL benötigt. Noch wichtiger ist, dass sie von sich aus darauf hinwies, dass es nicht nur um eine plumpe Übersetzung geht, sondern dass auch kulturelle Eigenheiten und Höflichkeitsformen beachtet werden müssen.

Ein erfrischendes Maß an Selbstreflexion. Für die eigentliche Batch-Übersetzung des statischen, hardcodierten Teils der romanischen Sprachen war mir Claude dann aber doch zu verkopft. Ich habe das stattdessen von GPT-5-Codex erledigen lassen. Auch hier gilt: Das richtige Tool für den richtigen Job!

Vom Intranet ins wilde Web

Nachdem die Toolsammlung so weit gediehen war (und sogar mehrere Sprachen sprach), stand sie eine ganze Weile nur bei uns im Firmennetzwerk zur Verfügung und leistete gute Dienste.

Irgendwann dachte ich mir: Warum eigentlich nicht? Also habe ich sie aufgeräumt und öffentlich gemacht.

Und weil das Ganze ja eh aus einem „Unfall” entstanden ist, liegt der Code komplett offen. Wer selbst mitbasteln will oder einen Fehler findet: Das Git-Repo findet ihr hier: https://github.com/RamonKaes/WebDev-Tools.

Ja, sorry. Jetzt ist sie hier. Die 10.000ste Toolsammlung. Aber hey, immerhin hat sie eine Entstehungsgeschichte! :D

Viel Spaß damit!

Ramon