Vom Google AI Studio-Prototyp zur einsatzbereiten App

Über unseren Kunden

Unser Kunde benötigte eine ERP-App zur Verwaltung von Personal, Abteilungen, Aufgaben, Terminen, Kalendern und interner Kommunikation. Die App wurde zunächst in Google AI Studio als PWA-Prototyp für mobile Geräte entwickelt.

Da dem Kunden Erfahrung in der Softwareentwicklung fehlte, waren die Anforderungen anfangs allgemein und änderten sich im Laufe des Projekts. Die App entstand schnell, enthielt jedoch doppelte Funktionen, UX-Mängel, Sicherheitslücken bei der Anmeldung und Schwächen in der Architektur.

Der Kunde wollte das bewährte Konzept erhalten und zugleich eine stabile Basis für den produktiven Einsatz und den weiteren Ausbau schaffen.

• Branche: ERP / Personal- und Teamverwaltung
• App-Typ: Progressive Web App (PWA)
• Projektdauer: 1,5 Monate

Herausforderung

Der Prototyp aus Google AI Studio zeigte, dass das Konzept funktionierte, war aber noch nicht für den produktiven Einsatz geeignet. Unklare Anforderungen führten zu zahlreichen Fehlern und erschwerten die Wartung.

Die App nutzte NoSQL, obwohl das ERP-System viele verknüpfte Daten zu Personal, Abteilungen, Aufgaben und Terminen verarbeiten musste. Auch Anmeldung und RBAC erforderten Verbesserungen. Zudem fehlten Datenmigrationen, Backups, Lasttests, Monitoring und Warnmeldungen.

Die enge Bindung an Google-Dienste wie Firebase und Cloud Run führte zu höheren Risiken bei Kosten und Betrieb sowie zur Abhängigkeit von einem Anbieter.

Das Projekt war daher ein typischer Fall von Vibe Coding für den Produktivbetrieb. Ziel war nicht nur die Einführung der App, sondern eine sichere, stabile und gut wartbare Lösung, die sich unabhängig bereitstellen und überwachen lässt.

Hauptziele

Das Hauptziel war, den Prototyp aus Google AI Studio in eine App für den produktiven Einsatz zu überführen. Für eine klare Umsetzung legten wir folgende Ziele fest:

• Prüfung und Überarbeitung des aus AI Studio exportierten Codes
• Erfassung funktionaler und nicht funktionaler Anforderungen
• Behebung erkannter Lücken gemäß OWASP Top 10
• Verbesserung von RBAC und der Anmeldung
• Einführung der Zwei-Faktor-Authentifizierung
• Umstieg von NoSQL auf PostgreSQL
• Automatische Migrationen der Datenbank mit Prisma
• Abbau unnötiger Abhängigkeiten von Google Cloud Run und Firebase
• Aufbau einer stabilen und günstigen Umgebung für den Betrieb
• Bereitstellung der App in Docker-Containern
• Automatische Deployments der App
• Backups für Datenbank und Dateien mit definierten RTO- und RPO-Werten
• Schutz durch Cloudflare Firewall und CDN
• Messung der Leistung und Festlegung eines SLA
• Monitoring und Warnmeldungen mit Prometheus und Grafana
• Einführung von E-Mail- und Push-Mitteilungen
• Vorbereitung auf die weitere Entwicklung nach klaren Vorgaben
• Eigenständige KI-gestützte Entwicklung durch den Kunden mit GitHub und Tools wie Claude Code, Cursor oder OpenCode

Projektübersicht

Zunächst exportierten wir das Projekt nach GitHub und prüften Architektur, Anmeldung, Rechte, Datenbank, Cache und Funktionen. Dabei fanden wir doppelte Funktionen, RBAC-Probleme, ein ungeeignetes NoSQL-Modell und Lücken bei Sicherheit und Betrieb.

Da Google AI Studio nur den Export nach GitHub erlaubt, wurde GitHub zur Basis der weiteren Entwicklung. Wir ersetzten NoSQL durch PostgreSQL, führten Prisma für Migrationen ein, verbesserten RBAC und Anmeldung, ergänzten 2FA und behoben OWASP-Lücken.

Wir integrierten Push- und E-Mail-Mitteilungen und verlagerten die App auf einen VPS mit Docker, Cloudflare, CDN und Backups nach RTO/RPO-Vorgaben. Die monatlichen Kosten für Hosting und E-Mail sanken von 126 auf 22 US-Dollar inklusive Steuern.

Automatisiertes CI/CD über GitHub verkürzte Releases auf etwa zwei Minuten. Mit Spec-Driven Development (SDD) kann der Kunde die App mithilfe von Claude Code, Cursor oder OpenCode selbst weiterentwickeln.

Lasttests ergaben eine P99-Latenz unter 300 ms bei 98 Anfragen pro Sekunde. Prometheus, Grafana, Log-Monitoring, Golden Metrics und E-Mail-Warnungen sichern die laufende Überwachung.

Lösung

Die fertige Lösung ist eine stabile ERP-PWA für den produktiven Einsatz. Die App wurde anhand klar definierter funktionaler und nicht funktionaler Anforderungen neu strukturiert. Doppelte Funktionen wurden entfernt und die Bedienung vereinheitlicht.

Der Kunde erhielt zudem eine eigene Umgebung für Entwicklung und Deployment, unabhängig von Google AI Studio. Das Team kontrolliert nun Code, Infrastruktur und Releases und kann die App über GitHub mit KI-Tools weiterentwickeln.

Kernfunktionen der Plattform

• Verwaltung von Personal, Abteilungen, Aufgaben, Terminen, Kalendern und interner Kommunikation
• Für mobile Geräte optimierte Progressive Web App (PWA)
• Verbesserte Rechteverwaltung (RBAC) nach Rollen im Unternehmen
• Zwei-Faktor-Authentifizierung per E-Mail
• E-Mail- und Push-Mitteilungen bei Ereignissen in der App
• Relationale Datenbank auf Basis von PostgreSQL
• Automatische Migrationen der Datenbank mit Prisma
• Backups für Datenbank und App-Dateien nach RTO/RPO-Vorgaben
• Bereitstellung der App in Docker-Containern
• Git-basiertes CI/CD mit Releases in etwa zwei Minuten
• Monitoring von App und Infrastruktur mit Prometheus und Grafana
• Schutz und Bereitstellung der App über Cloudflare Firewall und CDN
• Eigene Entwicklung über GitHub ohne Bindung an Google AI Studio
• KI-gestützte Entwicklung mit Claude Code, Cursor und OpenCode

Technologie-Stack

Um den Prototyp aus Google AI Studio in eine unabhängig betriebene App für den produktiven Einsatz zu überführen, nutzten wir folgende Technologien:

• Backend / Laufzeitumgebung: Docker, eigener VPS
• Datenbank: PostgreSQL
• ORM und Migrationen: Prisma
• Sicherheit: Cloudflare Firewall, RBAC, Zwei-Faktor-Authentifizierung per E-Mail, Behebung von Sicherheitslücken gemäß OWASP Top 10
• Bereitstellung und Auslieferung: Cloudflare CDN, eigene Domain
• CI/CD: Automatisches Deployment über Git
• Backups: Geplante Backups für Datenbank und Dateien mit definierten RTO- und RPO-Werten
• Monitoring: Prometheus, Grafana
• Benachrichtigungen: E-Mail-Warnungen
• Methode der Entwicklung: Spec-Driven Development (SDD)
• KI-Tools für die Entwicklung: Claude Code, Cursor, OpenCode

Kernteam

• Frontend-Entwickler: Passten die PWA-Oberfläche an und strukturierten sie für den produktiven Einsatz neu.
• Backend-Entwickler: Überarbeiteten Anmeldung, RBAC und Backend-Logik und integrierten PostgreSQL, Mitteilungen und Prisma-Migrationen.
• Projektmanager: Koordinierte die Klärung der Anforderungen, Prioritäten und Vorbereitung für den Produktivbetrieb.
• DevOps-Ingenieur: Richtete Docker, VPS, Cloudflare, Backups, CI/CD, Monitoring und Warnmeldungen ein.