Batchmaker Familie · React Application
W-Make Batch · React
Das eigenständige Next.js-Frontend für den vorhandenen Express-/SQLite-Fachkern von W-Make Batch.
- Verantwortung
- Frontend-Architektur, Migrationsstrategie und technische Qualität.
- Technik
- Next.js 16 · React 19 · TypeScript · Tailwind CSS · SWR · Playwright
- Stand
- Live · Frontend-Modernisierung
- Einordnung
- Ein kontrollierter UI-Wechsel: Der fachliche Backend-Vertrag bleibt stabil, der Client wird schrittweise modernisiert.
Ausgangslage
Ausgangslage
Ein Produktionssystem kann seine Benutzeroberfläche nicht wie eine Marketingseite austauschen. Buchungen, Rollen und die API müssen während einer Migration gleich bleiben.
Deshalb bleibt der Express-/SQLite-Fachkern die Quelle der Wahrheit. Das React-Frontend spricht über einen klaren Server-Proxy mit ihm, statt Geschäftslogik in den Browser zu verlagern.
Entscheidungen
Entscheidungen
- 01
App Router und Komponenten modernisieren die Oberfläche, ohne den fachlichen Buchungsweg umzuschreiben.
- 02
API-Zugriffe bleiben serverseitig vermittelt; der Browser erhält keinen direkten Datenbank- oder Secret-Zugang.
- 03
Der Legacy-Fallback ist ein eng gefasster Notfallpfad, kein zweites dauerhaftes Produkt.
- 04
Routen-, Rollen- und Smoke-Checks machen den UI-Wechsel überprüfbar.
Was man prüfen kann
Blick in die Anwendung.
Was man prüfen kann
Der Ablauf im Modell.
01
Backend-Vertrag
Der vorhandene Fachkern bleibt die Quelle für Auth, Rollen und Buchungen.
02
Server-Proxy
Die Next.js-Anwendung vermittelt API-Aufrufe ohne Backend-Details im Browser offenzulegen.
03
React-Oberfläche
Module werden als überprüfbare Routen und Komponenten modernisiert.
04
Fallback
Ein begrenzter Notfallpfad bleibt vom normalen React-Bundle getrennt.
Was bleibt
Was bleibt
Modernisierung ist dann sicher, wenn die fachliche Grenze stabil bleibt. Ein neuer Client darf den Produktionsvertrag nicht nebenbei neu erfinden.
batchmaker-react.w-make.com →30-Min. Erstanalyse · Kostenlos