managarten/apps/uload/docs/reports/email-setup-options.md
Wuesteon ff80aeec1f refactor: restructure
monorepo with apps/ and services/
  directories
2025-11-26 03:03:24 +01:00

9.8 KiB

E-Mail Setup Optionen für uLoad

Übersicht

Dieser Bericht analysiert verschiedene Möglichkeiten zur E-Mail-Integration in der uLoad-Anwendung, von kostenlosen bis zu selbst-gehosteten Lösungen.


1. Aktuelle Situation

PocketBase E-Mail System

  • Status: Integriert, aber nicht konfiguriert
  • Verwendung: Password Reset, E-Mail-Verifikation, Benachrichtigungen
  • Konfiguration: Über PocketBase Admin Panel → Settings → Mail settings

Benötigte E-Mail-Typen

  1. Transaktionale E-Mails (kritisch)

    • Password Reset
    • E-Mail-Verifikation
    • Account-Benachrichtigungen
  2. Marketing E-Mails (optional)

    • Newsletter
    • Feature-Ankündigungen
    • Nutzer-Engagement

2. E-Mail Service Provider Optionen

A. Kostenlose/Günstige Services

Resend Empfohlen für Start

  • Kosten: 100 E-Mails/Tag kostenlos, dann $20/Monat für 5.000
  • Vorteile:
    • Moderne API
    • Excellent für Entwickler
    • React Email Templates
    • Gute Deliverability
  • Integration:
// Beispiel: Resend mit SvelteKit
import { Resend } from 'resend';
const resend = new Resend('re_YOUR_API_KEY');

await resend.emails.send({
	from: 'noreply@yourdomain.com',
	to: user.email,
	subject: 'Password Reset',
	html: '<p>Click here to reset...</p>'
});

Brevo (ehem. Sendinblue)

  • Kosten: 300 E-Mails/Tag kostenlos
  • Vorteile:
    • SMTP + API
    • Marketing-Tools inklusive
    • EU-Server (DSGVO)
  • SMTP-Einstellungen:
Host: smtp-relay.brevo.com
Port: 587
Username: Ihre E-Mail
Password: API-Key

SendGrid

  • Kosten: 100 E-Mails/Tag kostenlos
  • Vorteile:
    • Zuverlässig
    • Gute Analytics
    • Twilio-Integration
  • Nachteile: Setup etwas komplexer

Mailgun

  • Kosten: 5.000 E-Mails/Monat für 3 Monate kostenlos
  • Vorteile:
    • Entwicklerfreundlich
    • Gute API
    • E-Mail-Validierung

B. Premium Services

Amazon SES

  • Kosten: $0.10 pro 1.000 E-Mails
  • Vorteile:
    • Extrem günstig bei Volumen
    • AWS-Integration
    • Hohe Deliverability
  • Nachteile: Komplexeres Setup

Postmark

  • Kosten: Ab $15/Monat für 10.000 E-Mails
  • Vorteile:
    • Beste Deliverability
    • Trennung Transaktional/Marketing
    • Exzellenter Support

3. Selbst-Hosting Optionen

A. Eigener SMTP Server

Postal Empfohlen für Self-Hosting

  • Type: Open Source Mail Server
  • Features:
    • Web-UI
    • API
    • Multi-Domain
    • Tracking
  • Installation:
# Docker Installation
git clone https://github.com/postalserver/postal
cd postal
docker-compose up -d

Mail-in-a-Box

  • Type: Komplette E-Mail-Lösung
  • Features:
    • SMTP, IMAP, Webmail
    • Automatisches SSL
    • DNS-Management
  • Voraussetzungen:
    • Dedizierter Server
    • Saubere IP (nicht blacklisted)

Mailcow

  • Type: Docker-basierte Lösung
  • Features:
    • Modern UI
    • Anti-Spam
    • Webmail (SOGo)
  • Installation:
git clone https://github.com/mailcow/mailcow-dockerized
cd mailcow-dockerized
./generate_config.sh
docker-compose up -d

B. Lightweight SMTP Relay

msmtp

  • Minimaler SMTP Client
  • Gut für kleine Projekte
  • Konfiguration:
# ~/.msmtprc
account default
host smtp.gmail.com
port 587
auth on
user your-email@gmail.com
password your-app-password
from your-email@gmail.com
tls on

4. Implementierung: E-Mails selbst versenden

Option 1: Nodemailer Integration

// src/lib/email/mailer.ts
import nodemailer from 'nodemailer';
import { SMTP_HOST, SMTP_PORT, SMTP_USER, SMTP_PASS } from '$env/static/private';

const transporter = nodemailer.createTransport({
	host: SMTP_HOST,
	port: SMTP_PORT,
	secure: false,
	auth: {
		user: SMTP_USER,
		pass: SMTP_PASS
	}
});

export async function sendPasswordResetEmail(email: string, token: string) {
	const resetUrl = `https://yourdomain.com/reset-password?token=${token}`;

	const mailOptions = {
		from: '"uLoad" <noreply@yourdomain.com>',
		to: email,
		subject: 'Password Reset Request',
		html: `
      <div style="font-family: Arial, sans-serif; max-width: 600px; margin: 0 auto;">
        <h2>Password Reset</h2>
        <p>You requested a password reset. Click the link below to set a new password:</p>
        <a href="${resetUrl}" style="display: inline-block; padding: 10px 20px; background-color: #0ea5e9; color: white; text-decoration: none; border-radius: 5px;">
          Reset Password
        </a>
        <p>If you didn't request this, please ignore this email.</p>
        <p>This link will expire in 1 hour.</p>
      </div>
    `
	};

	await transporter.sendMail(mailOptions);
}

Option 2: API Route für E-Mail-Versand

// src/routes/api/email/send/+server.ts
import { json } from '@sveltejs/kit';
import { sendEmail } from '$lib/email/mailer';

export async function POST({ request }) {
	const { to, subject, template, data } = await request.json();

	try {
		await sendEmail({
			to,
			subject,
			template,
			data
		});

		return json({ success: true });
	} catch (error) {
		return json({ error: 'Failed to send email' }, { status: 500 });
	}
}

Option 3: Queue-basierter Versand

// src/lib/email/queue.ts
import Bull from 'bull';
import { sendEmail } from './mailer';

const emailQueue = new Bull('email', {
	redis: {
		host: 'localhost',
		port: 6379
	}
});

emailQueue.process(async (job) => {
	const { to, subject, template, data } = job.data;
	await sendEmail({ to, subject, template, data });
});

export async function queueEmail(emailData: EmailData) {
	await emailQueue.add(emailData, {
		attempts: 3,
		backoff: {
			type: 'exponential',
			delay: 2000
		}
	});
}

5. E-Mail Templates

React Email (Moderne Lösung)

// emails/PasswordReset.tsx
import {
	Body,
	Button,
	Container,
	Head,
	Html,
	Preview,
	Section,
	Text
} from '@react-email/components';

export default function PasswordResetEmail({ resetUrl }: { resetUrl: string }) {
	return (
		<Html>
			<Head />
			<Preview>Reset your password</Preview>
			<Body style={main}>
				<Container style={container}>
					<Section>
						<Text style={heading}>Password Reset</Text>
						<Text style={paragraph}>Click the button below to reset your password:</Text>
						<Button style={button} href={resetUrl}>
							Reset Password
						</Button>
					</Section>
				</Container>
			</Body>
		</Html>
	);
}

const main = { backgroundColor: '#f6f9fc' };
const container = { margin: '0 auto', padding: '20px' };
const heading = { fontSize: '24px', fontWeight: 'bold' };
const paragraph = { fontSize: '16px', lineHeight: '26px' };
const button = { backgroundColor: '#0ea5e9', color: '#fff', padding: '12px 20px' };

6. Empfehlungen nach Projektphase

🚀 MVP/Entwicklung

  1. Gmail SMTP mit App-Password
  2. Einfach und kostenlos
  3. Limitiert auf 500 E-Mails/Tag

📈 Launch/Wachstum

  1. Resend oder Brevo
  2. Kostenlose Stufe ausreichend
  3. Einfache Integration

🏢 Produktion/Scale

  1. Amazon SES für Kosten-Effizienz
  2. Postmark für beste Deliverability
  3. Eigener Mail-Server für volle Kontrolle

7. Implementierungs-Checkliste

Sofort (für MVP):

  • Gmail App-Password erstellen
  • PocketBase SMTP konfigurieren
  • Password Reset testen
  • E-Mail-Verifikation aktivieren

Kurzfristig (vor Launch):

  • E-Mail Service Provider wählen
  • Domain-Verifikation (SPF, DKIM, DMARC)
  • E-Mail Templates erstellen
  • Transaktionale E-Mails implementieren

Langfristig (Skalierung):

  • E-Mail-Queue implementieren
  • Analytics/Tracking einrichten
  • A/B Testing für Templates
  • Bounce-Handling

8. Sicherheits-Überlegungen

Best Practices:

  1. Rate Limiting: Max 3 Password Resets pro Stunde
  2. Token Expiry: 1 Stunde für Reset-Links
  3. Keine E-Mail-Enumeration: Immer gleiche Response
  4. SPF/DKIM/DMARC: DNS-Records konfigurieren
  5. Unsubscribe: One-Click Unsubscribe für Marketing

Beispiel Rate Limiting:

// src/lib/rateLimit.ts
const attempts = new Map();

export function checkRateLimit(email: string): boolean {
	const key = `reset:${email}`;
	const now = Date.now();
	const hourAgo = now - 3600000;

	const userAttempts = attempts.get(key) || [];
	const recentAttempts = userAttempts.filter((time) => time > hourAgo);

	if (recentAttempts.length >= 3) {
		return false;
	}

	attempts.set(key, [...recentAttempts, now]);
	return true;
}

9. Kosten-Nutzen-Analyse

Lösung Kosten/Monat E-Mails Setup Deliverability Empfohlen für
Gmail SMTP €0 500/Tag MVP
Resend €0-20 100-5k Startups
Brevo €0-25 300-40k SMBs
Amazon SES €1-10 10k-100k Scale
Self-hosted €5-20 Unlimited Control

10. Fazit & Nächste Schritte

Sofort-Maßnahme für uLoad:

  1. Gmail SMTP für Development einrichten
  2. Resend Account erstellen (kostenlos)
  3. PocketBase mit Resend SMTP konfigurieren

Code-Snippet für .env:

# E-Mail Configuration
SMTP_HOST=smtp.resend.com
SMTP_PORT=587
SMTP_USER=resend
SMTP_PASS=re_YOUR_API_KEY
SMTP_FROM=noreply@yourdomain.com

PocketBase Konfiguration:

// In PocketBase Admin Panel eintragen
{
  "enabled": true,
  "host": "smtp.resend.com",
  "port": 587,
  "username": "resend",
  "password": "re_YOUR_API_KEY",
  "tls": true,
  "authMethod": "PLAIN",
  "localName": "yourdomain.com"
}

Erstellt am: 15. Januar 2025 Autor: Claude für uLoad Projekt Status: Zur Implementierung bereit