KI-gestützte Buchungswebsite in einem Nachmittag erstellen – so geht’s

Eine kleine Praxis benötigt eine Buchungswebsite für Online-Termine mit Anzahlungsfunktion. Traditionell würde ein Entwickler zwei Wochen für Kalender, Verfügbarkeitslogik, Zahlungsabwicklung und Datenbank einplanen. Doch mit einer cleveren Kombination aus KI-gestützter Frontend-Erstellung und einem Headless-CRM lässt sich das Projekt in einem einzigen Nachmittag realisieren.

Warum ein Headless-CRM die Entwicklung beschleunigt

Ein Headless-CRM trennt die Backend-Funktionen wie Datenverwaltung und Geschäftslogik von der Frontend-Präsentation. Statt selbst eine komplexe Datenbank zu bauen, nutzt man bestehende APIs und Tools, die bereits für Buchungssysteme optimiert sind. So entfallen zeitaufwendige Schritte wie Datenbankdesign, Migrationen oder die Implementierung von Verfügbarkeitsalgorithmen. Stattdessen übernimmt das CRM die gesamte Logik – vom Doppelbuchungsschutz bis zur automatischen Kundenverwaltung.

Schritt-für-Schritt: So entsteht die Buchungswebsite in unter fünf Stunden

1. Workspace einrichten – in nur fünf Minuten

Zunächst wird ein Workspace im Headless-CRM registriert und ein API-Schlüssel generiert. Dies geschieht bequem über die Kommandozeile, ohne dass eine manuelle Dashboard-Konfiguration nötig ist. Der Befehl favcrm signup request erzeugt eine Anfrage, die per E-Mail verifiziert wird. Nach erfolgreicher Bestätigung erhält man einen API-Schlüssel, der sicher in der Umgebung gespeichert wird – niemals im Quellcode!

favcrm signup request --email praxis@example.com \
  --organisation-name "Zahnarztpraxis Sonnengelb"

favcrm signup verify --request-id <ID> --code <6-stelliger-Code>

Der ausgegebene Schlüssel wird als Umgebungsvariable gespeichert:

export FAVCRM_API_KEY=fav_mcp_...

2. Dienstleistungen und Verfügbarkeit konfigurieren – in 30 Minuten

Der nächste Schritt ist die Einrichtung der angebotenen Leistungen und der Arbeitszeiten des Praxismitarbeiters. Dies lässt sich effizient per KI-Agent erledigen, der die notwendigen API-Aufrufe automatisch ausführt. Zunächst wird das Schema der create_service-Funktion abgefragt, um die korrekten Parameter zu verstehen. Anschließend werden die einzelnen Dienstleistungen angelegt:

favcrm tool call create_service '{
  "name": "Erstuntersuchung",
  "durationMinutes": 45,
  "price": "90.00"
}'

Für jede angebotene Leistung wird ein ähnlicher Befehl ausgeführt. Anschließend wird die wöchentliche Verfügbarkeit des Mitarbeiters definiert:

favcrm tool call set_staff_availability '{
  "weekday": "mon",
  "start": "08:00",
  "end": "18:00"
}'

Diese Schritte wiederholen sich für jeden Wochentag. Nach Abschluss ist das Backend bereits vollständig funktionsfähig: Es verwaltet Dienstleistungen, Arbeitszeiten und verhindert Doppelbuchungen – ohne dass eine einzige Zeile Geschäftslogik im eigenen Code geschrieben wurde.

3. Einfache Server-Route als Proxy – nach 30 Minuten erledigt

Die Sicherheit steht an erster Stelle: Der API-Schlüssel darf niemals im Browser oder in der Client-Anwendung landen. Stattdessen wird eine einzige Server-Route erstellt, die als Proxy zwischen Frontend und CRM fungiert. Diese Route stellt zwei grundlegende Funktionen bereit:

• Abrufen verfügbarer Zeitfenster für eine ausgewählte Dienstleistung
• Erstellen einer Buchung basierend auf den Benutzerdaten

Die Implementierung in Next.js sieht wie folgt aus:

// app/api/booking/route.js (Next.js-Route-Handler)
const MCP = '

async function callTool(name, args) {
  const res = await fetch(MCP, {
    method: 'POST',
    headers: {
      'content-type': 'application/json',
      authorization: `Bearer ${process.env.FAVCRM_API_KEY}`,
    },
    body: JSON.stringify({
      jsonrpc: '2.0',
      id: 1,
      method: 'tools/call',
      params: { name, arguments: args },
    }),
  });
  if (!res.ok) throw new Error(`FavCRM ${res.status}`);
  return res.json();
}

export async function GET(req) {
  const { searchParams } = new URL(req.url);
  const slots = await callTool('get_available_slots', {
    serviceId: searchParams.get('serviceId'),
    date: searchParams.get('date'),
  });
  return Response.json(slots);
}

export async function POST(req) {
  const body = await req.json();
  const booking = await callTool('create_booking', {
    serviceId: body.serviceId,
    start: body.start,
    customer: {
      name: body.name,
      email: body.email,
    },
  });
  return Response.json(booking);
}

Diese Route übernimmt keine eigene Geschäftslogik – sie leitet lediglich Anfragen an das CRM weiter und gibt die Antworten zurück. Funktionen wie Doppelbuchungsprüfung, Speicherung von Buchungen oder Kundenverwaltung werden vollständig vom CRM übernommen.

4. KI-generierte Buchungs-UI in ein bis zwei Stunden

An dieser Stelle kommt die KI ins Spiel: Ein Prompt an den KI-Agenten reicht aus, um eine vollständige, funktionsfähige Benutzeroberfläche zu generieren. Die Anforderungen an die KI sind klar definiert:

• Eine Buchungsseite erstellen, die Dienstleistungen anzeigt
• Auswahl einer Dienstleistung und eines Datums ermöglichen
• Verfügbare Zeitfenster per GET /api/booking abrufen
• Buchung per POST /api/booking bestätigen
• Erfolgreiches Buchen mit Bestätigungsmeldung anzeigen

Der KI-Agent liefert den React-Code für die gesamte Benutzeroberfläche. Der Entwickler muss lediglich noch das Styling an die Corporate Identity der Praxis anpassen – die komplexen Teile wie Verfügbarkeitslogik oder Datenpersistenz sind bereits abgedeckt.

5. Testlauf: Eine echte Buchung durchführen

Nach der Implementierung wird die Buchungsfunktion in einem echten Browser getestet. Ein erfolgreicher Test zeigt, dass die Buchung tatsächlich im CRM angelegt wurde. Dies lässt sich mit einem einfachen Befehl überprüfen:

favcrm tool call list_bookings '{}'

Die Buchung ist nun im System gespeichert. Gleichzeitig wurde ein neuer Kundenkontakt angelegt – das CRM übernimmt die Verwaltung und Verknüpfung der Daten. Bei einer erneuten Buchung desselben Kunden wird diese automatisch mit dem bestehenden Profil verknüpft.

Was erreicht wurde – und was entfiel

Das Ergebnis ist eine voll funktionsfähige, markenkonforme Buchungswebsite für die Praxis. Kunden können online Termine buchen, und die Anzahlung wird über Stripe abgewickelt. Folgende Komponenten wurden nicht selbst entwickelt:

• Datenbank und deren Migrationen
• Verfügbarkeitsalgorithmus
• Logik zur Vermeidung von Doppelbuchungen
• Kundenverwaltungstabellen
• Stripe-Webhook-Reconciliation

Stattdessen wurden nur drei Dinge selbst umgesetzt:

1. Die Konfiguration der Dienstleistungen und Arbeitszeiten
2. Eine einfache Proxy-Route als Schnittstelle
3. Die Benutzeroberfläche (Styling und Branding)

Fazit: Mehr Tempo, weniger Aufwand

Ein Headless-CRM wie FavCRM ermöglicht es Entwicklern und Agenturen, komplexe Backend-Funktionen auszulagern und sich auf das Wesentliche zu konzentrieren: die Erstellung einer benutzerfreundlichen Oberfläche. Kombiniert mit KI-Tools, die Routineaufgaben übernehmen, lässt sich eine voll funktionsfähige Buchungsplattform in einem einzigen Nachmittag realisieren. Besonders für kleine Unternehmen oder Agenturen, die schnell und kostengünstig Lösungen bereitstellen müssen, ist dieser Ansatz eine echte Game-Changer. Die kostenlose Version des CRM deckt ein solches Projekt vollständig ab – probieren Sie es aus und sparen Sie sich wochenlange Entwicklungsarbeit.