~/jonasfink.dev

← cd ..

lightMe – Ganzheitliche Health-App

2026 · Full-Stack Developer
ReactTypeScriptTailwind v4Node.jsExpress.jsMongoDB
lightMe – Ganzheitliche Health-App — screenshotlightMe – Ganzheitliche Health-App — screenshotlightMe – Ganzheitliche Health-App — screenshotlightMe – Ganzheitliche Health-App — screenshotlightMe – Ganzheitliche Health-App — screenshotlightMe – Ganzheitliche Health-App — screenshotlightMe – Ganzheitliche Health-App — screenshotlightMe – Ganzheitliche Health-App — screenshotlightMe – Ganzheitliche Health-App — screenshot

Problem

Die meisten Health-Apps trennen das Tracking in Silos: eine App fürs Essen, eine andere für die Stimmung, eine dritte für Bewegung – und keine zeigt, wie diese drei über ein 12-Wochen-Programm hinweg tatsächlich zusammenwirken. Hinzu kommt: Ernährungsdaten sind notorisch unzuverlässig – keine einzelne Lebensmittel-Datenbank hat gute Abdeckung, Barcodes fehlen, und die Portionsskalierung ist leicht subtil falsch. Ich wollte eine App, die Ernährung, Stimmung und Bewegung zusammenhält – vertrauenswürdig genug, um ein echtes Coaching-Programm darauf aufzubauen.

Lösung

Eine React-19-App mit TypeScript, gestützt auf eine Express/MongoDB-API. Lebensmittel-Abfragen kaskadieren über FatSecret, USDA und OpenFoodFacts, sodass die Abdeckung auch dort hält, wo eine einzelne Quelle versagt, mit einem react-zxing-Barcode-Scanner und einem gemeinsamen Portionsskalierungs-Helfer, der über Suche, Favoriten und Scans hinweg wiederverwendet wird – keine driftende, duplizierte Rechenlogik. Ein Recharts-Dashboard bringt Gewicht, Maße, Stimmung, Kalorien und Aktivität auf dieselbe Zeitachse. Die JWT-Authentifizierung nutzt In-Memory-Access-Tokens mit stillem httpOnly-Cookie-Refresh, Stripe Checkout steuert den vierstufigen Abo-Flow hinter einem Feature-Flag, und ein rollengeschütztes Admin-Dashboard zeigt Insights pro Nutzer:in, MRR/ARPU und Abo-Gesundheit.

Technische Notizen

Die Codebasis ist um Dedupe-Nahtstellen herum gebaut, statt um Abstraktionen um ihrer selbst willen: Portionsskalierung, Mahlzeitentypen, Plan-Stufen und die Dashboard-Sektions-Chrome leben jeweils an genau einer Stelle. Wenn Seiten über ~500 Zeilen wuchsen, habe ich Logik in Hooks gezogen und die UI aufgeteilt – die Food-Diary-Seite ging via vier Hooks und vier Komponenten von 991 auf 278 Zeilen zurück. Das Admin-Bundle ist per React.lazy abgetrennt, sodass normale Nutzer:innen seine Kosten nie tragen, und die Stripe-CTAs stehen hinter einem Env-Flag, sodass die Produktion einen sauberen „Coming soon“-Zustand ausliefert, ohne den Build zu brechen.

© 2026 Jonas Fink