Zum Inhalt springen

Schnellstart

Die Kurzfassung für alle, die nur die Checkliste möchten. Jeder Punkt verweist auf den passenden Schritt im Tutorial, wo alles mit Screenshots erklärt wird.

  • Registrieren Sie sich auf app.frontmail.dev mit E-Mail und Passwort, mit Google oder GitHub. Bestätigen Sie Ihre E-Mail-Adresse – bis dahin können Sie sich umsehen, aber nichts senden.
  • Organisation erstellen: Füllen Sie Name der Organisation und Rechnungsland aus (legt Umsatzsteuer und Währung fest), wählen Sie bei Was möchten Sie versenden? eine der Optionen Kontaktformular, Transaktionale E-Mails oder Etwas anderes und klicken Sie auf Organisation erstellen.
  • Sie starten im Tarif Free mit 300 Anfragen für diesen Monat. Frontmail zeigt Ihren ersten privaten Schlüssel – nur ein einziges Mal. Kopieren Sie ihn in Ihren Passwortmanager oder in die Secrets Ihres Servers; Sie brauchen ihn nur für den Versand vom Server. Klicken Sie dann auf Weiter zur Einrichtung.

Die Seite Erste Schritte führt Sie durch sechs Schritte. Jeden davon können Sie überspringen (Schritt überspringen, Einrichtung überspringen) und später nachholen.

  1. E-Mail-Dienst verbinden – E-Mail-Dienste → Dienst hinzufügen, Anbieter auswählen, Zugangsdaten eintragen (bei Gmail / Outlook Mit Ihrem Konto verbinden), Prüfen & speichern. → Tutorial, Schritt 1
  2. Vorlage erstellen – Vorlagen → Aus der Galerie → Kontaktformular → Vorlage verwenden. An ist bereits mit Ihrer Adresse vorbelegt, Reply-To mit der des Besuchers. → Tutorial, Schritt 2 (und Schritt 3 für eine automatische Antwort)
  3. Erlaubte Domains & Bot-Schutz – Sicherheit → Erlaubte Websites → Domain hinzufügen, z. B. example.com, *.example.com oder localhost:3000, dann Speichern. Empfohlen: Hinterlegen Sie unter Bot-Schutz (Turnstile) die Schlüssel Ihres eigenen kostenlosen Cloudflare-Turnstile-Widgets und klicken Sie auf CAPTCHA für alle Vorlagen aktivieren. → Tutorial, Schritt 4
  4. Test-E-Mail senden – im Editor auf Test senden. Kostenlos, 20 pro Tag. → Tutorial, Schritt 6
  5. In Ihre Website einbauen – kopieren Sie den Code aus dem Tab Snippets der Vorlage (HTML / JS, React, Vue, Svelte, Node.js, cURL). → Tutorial, Schritt 5
  6. Absichern und einladen – schalten Sie optional die Zwei-Faktor-Authentifizierung ein und laden Sie Kolleginnen und Kollegen ein (Team).

Der Tab Snippets setzt Ihren öffentlichen Schlüssel und die IDs bereits ein. Code im Browser verwendet den öffentlichen Schlüssel (pk_…), Server einen privaten Schlüssel (sk_…):

Terminal-Fenster
npm install @frontmail/browser
import { init, send } from '@frontmail/browser';
init({ publicKey: 'pk_…' });
const result = await send('svc_…', 'tpl_…', {
name: 'Julia Schneider',
email: 'julia@example.de',
message: 'Guten Tag, ich hätte gern ein Angebot.',
});
console.log(result.status); // "queued" (oder "held", wenn Ihre Credits aufgebraucht sind)

Eine Vorlage mit CAPTCHA verlangen (Turnstile) braucht zusätzlich ein Turnstile-Token – ein vollständiges Formular mit sendForm() finden Sie unter Formular bauen.

Die API antwortet mit 202 Accepted und einer message_id; die E-Mail verfolgen Sie anschließend im Verlauf.