Wer ein Aktiendepot hat, kennt das Problem: Man will nicht ständig Kurse prüfen, aber wenn eine Aktie über die Zielmarke steigt oder unter die Schmerzgrenze fällt, will man es sofort wissen. Genau dafür haben wir in den letzten Tagen ein kleines Tool gebaut: Stock Alarm — eine Seite im eigenen Finanz-Cockpit, die Depot, Charts und Telegram-Benachrichtigungen verbindet. Gebaut wurde das Ganze gemeinsam mit einer KI (Claude, im Cowork-Modus) — vom Konzept bis zum letzten Pixel-Feinschliff für die Anzeige am iPAD, iPhone und PC im Browser.

Was das Tool kann

Depot als Datenquelle. Die Aktienauswahl kommt nicht aus einer handgepflegten Liste, sondern direkt aus der zentralen pos.json des Cockpits. Wird eine Aktie gekauft oder verkauft, ist die Auswahl nach dem nächsten Kurs-Refresh automatisch aktuell.
Ein 🔄-Button stößt die Aktualisierung auch manuell an.

Echte Kurskurven: Ein Python-Script holt einmal täglich die Tagesschlusskurse — rund 18 Monate Historie pro Titel. Angezeigt wird die Year-to-Date-Kurve; der Vorlauf dient den gleitenden Durchschnitten: SMA 50 und SMA 200 sind per Checkbox zuschaltbar und über die volle Historie gerechnet, damit sie vom ersten Januartag an gültig sind.

Einstand und Kaufzeitpunkte im Chart. Eine Linie zeigt den Einstandskurs.
Bei Fremdwährungen mit Wechselkurs umgerechnet. Kleine Kreise markieren die tatsächlichen Kaufzeitpunkte auf der Kurve, gespeist aus dem Trade-Log. So sieht man auf einen Blick: Wo bin ich eingestiegen, und wie ist der Kurs seither gelaufen?

Das Herzstück: Für jede Aktie lassen sich Ober- und Untergrenze setzen — als absoluter Kurs oder bequem per Prozent, ganz ohne Tastatur, wichtig am iPad. Ein Klick auf „Alarm setzen" speichert die Grenzen serverseitig; ein Cron-Job prüft stündlich zu Handelszeiten die Live-Kurse und schickt bei Über- oder Unterschreiten eine Telegram-Nachricht. Erst wenn der Kurs in den Korridor zurückkehrt, wird erneut gemeldet. Aktive Alarme werden beim Laden vorbelegt, und wer Werte ändert und zur nächsten Aktie springt, bekommt den Alarm automatisch mit den neuen Werten gesetzt.

Die Technik dahinter

Bewusst schlank, ohne Framework: eine statische HTML-Seite mit Vanilla-JavaScript und Inline-SVG für den Chart (Tooltip, Crosshair, Monatsachse). Serverseitig zwei kleine PHP-Endpoints (Alarm speichern, Refresh anstoßen) und zwei Python-Scripts (Kurshistorie, Alarm-Check), die sich in die bestehende Cockpit-Architektur einfügen: ein Trigger-File-Muster verbindet den PHP-Container mit dem Host, der die Python-Jobs ausführt. Die Telegram-Zugangsdaten liegen am Server — die Seite selbst sieht sie nie.

Feinschliff für iPad und iPhone

Der vielleicht lehrreichste Teil war die Mobile-Optimierung. Ein paar Fundstücke aus der Praxis:

  • iOS Safari vergrößert im Querformat ungefragt die Schrift („text auto-inflation") — das erzeugte horizontales Scrollen. Abhilfe: text-size-adjust: 100%.
  • Verschachtelte Flexboxen mit min-width: auto ließen die Toolbar am iPhone auf die Breite des längsten Dropdown-Eintrags aufblähen — nur die halbe Box war sichtbar. Abhilfe: min-width: 0 und volle Breite fürs select.
  • Pinch- und Doppeltipp-Zoom sind abgeschaltet, Schriftgrößen der Kennzahl-Kacheln je Gerätebreite abgestuft, und die Checkbox-Labels wurden gekürzt, damit am iPhone nichts ineinanderläuft.

Fazit

Vom ersten Prototyp mit fest einkodierten Snapshot-Daten zum datengetriebenen Tool mit Live-Kursen, Charts und Push-Benachrichtigungen — iterativ in kleinen Schritten: bauen, am echten Gerät testen, nachschärfen. Genau so fühlt sich Pair-Programming mit einer KI inzwischen an: Man beschreibt das Problem („am iPhone sehe ich nur die Hälfte der Box"), und gemeinsam findet man die Ursache im CSS. Das Ergebnis läuft jetzt täglich — und meldet sich per Telegram, wenn eine Aktienchart aus dem min-/max-Korridor ausbricht.