Claude und ich – ein starkes Team?

Vielleicht habe ich es ein klein wenig übertrieben. Doch nach dem letzten Beitrag habe ich es getan: Ich habe mir für einen Monat Claude Code geholt. Und was soll ich sagen: Ich wusste nicht, wie viel man an bestehenden Projekten anpassen kann, ohne das es einen sichtbaren Effekt hat. Das Stichwort hierbei ist: Technische Schulden. Doch fangen wir von vorne an.

Einmal initialisieren bitte!

Idealerweise lässt man seine Projekte einmal initialisieren, damit Claude sich einen Überblick verschaffen kann, um was es hier genau geht. Da Claude ein fleißiges Kerlchen ist, habe ich das natürlich gleich gemacht – gleichzeitig. Finanzl Frontend. Finanz Backend. CD-Manager. Das Comdirect Tool. Dividendenbot. aktienanalyse-online.de. markus-liebl.de, ….

Danach bin ich total eskaliert. Ich hatte ständig drei Desktops am laufen. Auf jedem Desktop ein anderes Projekt offen. Einmal in der Entwicklungsumgebung und ein Claude Terminal dazu. Reih um habe ich mich durch die Desktops geschaltet und Anweisungen gegeben, Vorschläge gelesen, Code geprüft oder Funktionen getestet. Trotz erhöhter Limits bin ich schnell an das fünf Stunden Limit gestoßen. Das ist am Wochenende vielleicht mal kurzzeitig ein Problem. Unter der Woche nach der Arbeit habe ich das zwar auch manchmal erreicht, doch das war dann für mich auch immer ein guter Punkt zu sagen: Für heute ist Schluss.

Nach einer Woche wurde mein Wochenlimit bei 92% Nutzung zurückgesetzt. Das habe ich also gut genutzt. Doch genau damit hatte ich auch im Vorfeld schon geplant: Ich wusste, dass die nächsten Wochenenden ein paar freie Lücken für private Projekte haben. Und weil gerade mal wieder das fünf Stunden Limit erreicht ist und ich noch eine Stunde habe, bis ich weiter arbeiten kann, habe ich mir gedacht: fassen wir doch mal zusammen, was man so mit Claude in einem Monat schafft.

Projektupdates

Ich versuche mal auf die Reihe zu bekommen, an welchen Projekten ich was geändert habe. Keine Garantie auf Vollständigkeit. Das war auf die erste Woche schon so viel, dass es mich nicht wundern würde, wenn ich da Sachen ‚vermische‘. Es ist auch nicht so, das Claude jeden Handgriff gemacht hat, denn ein paar npm Pakete installieren habe ich auch alleine geschafft.

Landing Page: https://www.markus-liebl.de

Da ich dieses Projekt soeben abgeschlossen habe, fange ich gleich damit an, denn da sind die Änderungen noch frisch im Gedächtnis. Die Seite beinhaltet ja nur ein Bild, einen kleinen Lebenslauf und die Links zu meinen Blogs und den Social Media Profilen. Was gibt’s da zu ändern?

  • Angular: Update auf Version 22
  • Ein paar Umstrukturierungen auf der Seite gemacht (Navigation, „Unterseiten“, Impressum)
  • Angular: Seite auf Zoneless umgestellt
  • Angular: Build & Deploymentskripte angepasst
  • Fontawesome Paket entfernt und SVGs inline eingebunden
  • Das ganze Thema um das Bulma Framework nochmal aufgearbeitet (nutze weiterhin 0.9.3)
  • Am Ende noch festgestellt, das Lighthouse noch ein paar Vorschläge in petto hätte.
  • Private Projekte mit auflisten
  • Lighthouse 100%

Das Ergebnis sehr ihr hier: https://www.markus-liebl.de

Homepage-Data-Manager

Wie lange wollte ich den schon machen. Einfach eine kleines Tool mit dem ich die gesehenen Serien verwalten kann (Das meine alte .NET Applikation ablöst), meine neuen CDs, die Filme für die Liste sowie die Konzerte & Festivals für den Blog eintragen kann. Ja, all das trage ich ständig per Hand in der Datenbank ein. Ich hatte mir aber dann final schon einen Homepage-Data-Manager gemacht. .NET Core 10. Web-API. Angular Frontend. Läuft einfach bei mir am PC. Allerdings habe ich nach dem Menüpunkt ‚Neue CDs‘ aufgehört (und einer Aufbereitung der Jahresstatistik). Ein Grund war, dass ich mich für Angular Material entschieden habe, doch ich damit irgendwie nicht so ganz glücklich war.

  • Angular Material raus
  • Layout & Styling in die eigene Hand genommen (also Claude)
  • Filme können jetzt hinzugefügt & bearbeitet werden
  • Serien können jetzt hinzugefügt & bearbeitet werden
  • Bands bei Konzerten können fix hinzugefügt und bearbeitet werden
  • Festivals können hinzugefügt und bearbeitet werden
  • Bands bei Festivals können hinzugefügt werden (bearbeiten habe ich da noch ausgespart)
  • Blog Statistik für 3 Jahre zum zurückblättern

Nebeneffekt: Kein manuelles schreiben in die Datenbank mehr. Automatische Statistik. Alter Homepage Datamanager obsolete. Alter Serienmanager obsolete. Alte Webservices die Web-Call Daten abgefragt haben, obsolete.

Aktienanalyse-Online

Die Seite ist ja auch nur noch rudimentär in Benutzung. Aber da ich ja gerade alle Seiten auf Angular 22 umgestellt habe, habe ich das hier gleich mit gemacht.

  • Angular: Update auf Version 22
  • Angular: Umstellung auf Signals
  • Angular: Seite auf Zoneless umgestellt
  • Angular: Build & Deploymentskripte angepasst
  • Angular: Tests hinzugefügt
  • Lighthouse 100%

Wer den Dividendenbot nicht nutzt, für den ist die Seite fast uninteressant: https://www.aktienanalyse-online.de/

Comdirect

  • View Models zusammenfassen lassen
  • Kleinere Fehler identifiziert und behoben
  • Refactoring & Optimierungen (Blöcke zusammengefasst, Generische Request Klasse, ….)

Projekt findet man öffentlich auf Github: https://github.com/ProjectMedlan/comdirect

CD-Manager

Mein guter alter CD-Manager. Den habe ich ja erst vor einiger Zeit von klassischem .NET nach .NET Core portiert. Und auch wenn hier einige Codestellen angefasst wurden und ich mir dachte: Wow. Das habe ich gut gemacht, da gibt’s sicherlich nicht viel zu bemängeln, hat Claude doch den einen oder anderen Punkt gefunden. Am besten fand ich aber vor allem. Diese Dapper AOT Warnung. Ich hatte das versucht zu aktivieren, danach hat nichts mehr kompiliert. Aber die Fehlermeldung hat mich da nicht wirklich auf die richtige Spur geführt. Für Claude war das kein Problem. Die Lösung war auch denkbar einfach. Die Aktivierung hätte eine Zeile später stattfinden müssen.

  • Refactoring & Optimierung (Datenklassen, DB Zugriffe, Codes zusammengefasst; Identische Codestellen identifiziert)
  • Dapper AOT aktiviert
  • Offene Fragen geklärt (Mein „UI-Bug“ in der Statistik)

Zusatz: Das hatte ich schon mal mit Copilot angefangen: Ich kann jetzt auch CD-Cover in größer mit ablegen. Dazu habe ich mir ein kleines Skript bauen lassen, dass mir für die bestehende Sammlung schon entsprechende Vorschläge macht. (Muss ich allerdings mal in Ruhe ausprobieren)

Privates Repository auf Github – kein öffentlicher Link verfügbar

Finanzl Frontend

Hier wurde am meisten geändert, denn hier habe ich mit dem Copilot schon mal ein Wochenende lang ein paar Leichen weg geschafft. Hier habe ich am meisten Änderungen vorgenommen ohne auch nur eine einzige Verbesserung auf der Seite selbst zu erkennen. Doch warum gab’s hier so viel zu machen? Als ich das Projekt angefangen habe gab es noch keine Signals, kein Standalone, mit Ionic hatte ich zudem noch ein unbekanntes Framework mit rein genommen. Man updated zwar dann immer die neusten Versionen, doch damit wird ja das bestehende Projekt nicht automatisch auf den technisch neusten Stand gebracht. Ich hatte zwar schon auch immer bei neueren Services versucht auf Standalone & Signals zu gehen, doch wovor es mir immer graut sind halt alte, bestehende Komponenten: Never touch a running system.

Aber jetzt wo man es schon mal angefasst hat …. Und, und das muss man Claude schon auch zu Gute halten, wenn er was kaputt macht, kann er es im Regelfall auch wieder reparieren. Und nicht nur das: wenn ich was kaputt mache, kann Claude das im Regelfall auf einer Ebene recherchieren und analysieren, so tief mag ich in manche fremde Frameworks (Ionic) gar nicht einsteigen.

  • Angular: Update auf Version 22
  • Angular: Umstellung auf Signals
  • Angular: Umstellung alle Module entfernt
  • Angular: Seite auf Zoneless umgestellt
  • Angular: Build & Deploymentskripte angepasst
  • Angular: Tests hinzugefügt
  • Angular: Refactoring & Optimierungen (Strukturen, Services, Modelle, ….)
  • Feature: Automatische ‚Versionierung‘
  • Feautre: Nur noch verwendete Icons deployen – check beim build
  • Feature: Dividenden-Hochrechnung visualisieren

Privates Repository auf Github – kein öffentlicher Link verfügbar

Finanzl Backend

Wenn ich für eins bekannt bin, dann sind es ‚God-Classes‘. In Javascript hatte ich mich da erst recht nicht damit beschäftigt, wie ich da meine Datenbank-Zugriffe auf mehrere Dateien aufteile. Daher war das glaube ich auch einer der ersten Punkte, die Claude vorgeschlagen hat.

  • Repositories für die einzelnen Datenbank-Zugriffe
  • Diverse Anpassungen und Fehlerkorrekturen
  • Erste Dividenden-Hochrechnung

Privates Repository auf Github – kein öffentlicher Link verfügbar

Amazing Observer

Den hätte ich jetzt fast vergessen, obwohl der ausschlaggebend war. Ich hatte mal wieder das Problem, dass ich bei einer Seite keine Preise mehr bekommen habe. Da hat mir der Copilot in wenigen Minuten eine Lösung erarbeitet. Gut, dass der Anbieter dann nochmal nachgezogen hat und das Ganze zwei Wochen später wieder nicht mehr funktioniert hat, dafür kann auch die AI nix. Aber auch meinen Amazing Observer wollte ich ja schon lange mal neu strukturieren. Denn von den Sachen, wie ich sie mir damals gedacht habe, geht nach den vielen Jahren mittlerweile kaum noch was.

  • Kompletter Rewrite der Anwendung: WepAPI + WinForms. Durch die Trennung ein späteres/zusätzliches Angular Frontend möglich
  • UI Elemente selber positioniert. Vom Code her kaum eine Zeile selber geschrieben.
  • Alte Anbieter, die nicht mehr klappen, beheben lassen
  • Neue Anbieter hinzufügen

Vermutlich werde ich da jetzt im Nachgang jetzt noch ein paar Sachen anpassen, da mein Claude Abo am letzten Tag ausgelaufen ist. Hab‘ gerade so die Basisimplementierung noch fertig bekommen. Ich denke dann kann ich mir auch mal ein Bild davon machen, was Claude da so gebaut hat. Aber hey: Erst mal funktioniert alles wieder.

Discord Dividenden Bot

Ich habe ja für unseren Discord einen kleinen Dividenden-Bot programmiert. Den hatte ich ja auch mal auf eine schönere Struktur und Typescript umgestellt. Hier und da mal etwas fine-tuning gemacht und natürlich die Pakete immer wieder aktualisiert. War es daher verwunderlich, dass Claude da auch etwas Verbesserungspotential erkannt hat?

  • (Nicht aufgefallene) Bugs behoben
  • Typescript warnings behoben
  • Datenbank Zugriffe auf ein neues Paket umgestellt (So wie im Finanzl-Backend)
  • Feature: Spamschutz für unseren Server

Medlan.de

Am Blog habe ich mir irgendwann mal Seiten Templates für meine Statistiken gebastelt – und seitdem nicht mehr angefasst. Ich habe die jetzt nicht vollständig Überarbeitet, sondern nur hier und da ein paar Anpassungen vorgenommen.

  • Seitentemplates überarbeitet
  • Plugins überarbeitet
  • Eigenes jQuery raus
  • Highchart Update
  • Template Strukturen optimiert
  • Konzert-Liste: CSS Fix
  • CD-Manager & CoverCovered auf die neuen jQueryVersionen umgestellt

Weiteres Tools

Firmenlogo Download & Convert

Ich hatte mir immer so Fimenlogos für’s Finanzl als SVG gespeichert und manuell zusätzlich nach png & jpg konvertiert. Das war, wenn man die Handgriffe parat hatte, schon recht fix gemacht. Aber dank Claude habe ich jetzt ein Powershell Skript, dass das in einem Rutsch erledigt.

Focus Money Downloader

Jeden Donnerstag gibt’s für mich eine neue Foucs Money zu lesen. Seite öffnen. Download. Warten. Datei verschieben. Muss das sein? Ne! Jetzt ein Doppelklick und die Möglichkeit das in meinen lokalen Service zum integrieren, dann spare ich mir auch noch das manuelle aufrufen.

Projektübersicht

Ich habe mir auch gleich noch eine Projektübersicht mit generieren lassen. Damit ich einen kleinen Überblick über meine Projekte habe. Ebenso eine neue Liste meiner Web-Projekte.

100 Kleinigkeiten

Ich habe am Ende gar nicht so schnell die Liste hier füllen können wie ich Änderungen gemacht habe. PHP Skripte angepasst. Code-Reviews. Projekte dokumentieren lassen. Server Logs analysiert. CoverCovered & CoverCovered Multiplayer & CD-Manager auf die neuen jQuery Versionen umgestellt. Eine Übersicht meiner URLs mit PHP & Node Versionen so wie den URL und Git-Repositories als Übersicht erstellen lassen. Die Liste ist wirklich endlos.

Die Kehrseite der Medaille

Wow! Ist das nicht alles toll? Ist es doch, oder? Es gibt natürlich auch eine Kehrseite der Medaille. Denn auch wenn ich weiß, was wir an den Projekten angepasst & gemacht haben, ist es ja so, dass das tiefe Wissen bei einigen Änderungen nicht von mir kam, sondern von Claude. Sprich wenn ich jetzt an den Projekten was anpassen muss, muss ich wissen, wie die neuen Technologien funktionieren. Das ist auch so ein Problem bei technischen Schulden. Wenn man sich nur Oberflächlich mit einem Thema beschäftigt so dass man es einigermaßen verwenden kann und man dann die komplette Architektur automatisiert umstellt, bleibt unter Umständen kein Stein mehr auf dem anderen. Man ist zwar dann wieder auf einem aktuellen und modernen Stand, doch die Lernkurve, wenn man selber was ändern muss, fängt dann wieder bei Null an.

Was mir generell aufgefallen ist, man verliert sich dann auch schnell in Kleinigkeiten, die vielleicht nicht ideal sind, aber an sich auch so klein sind, dass sie kein Problem verursachen. Aber man macht das dann halt gleich mit. Wie zum Beispiel, dass man dann eine robots.txt mit ausliefert für die Web-Projekte. Aber wenn einem Claude das schon vorschlägt – warum nicht?