Інтеграція Resend для трансакційних email
Resend — сучасний email API з нативною підтримкою React Email, зрозумілою документацією та щедрим безплатним тарифом (3000 листів/місяць). Підходить для SaaS-стартапів та додатків, які хочуть швидко підключити надійну трансакційну пошту.
Встановлення та перша відправлення
npm install resend
import { Resend } from 'resend';
const resend = new Resend(process.env.RESEND_API_KEY);
// Проста відправлення
const { data, error } = await resend.emails.send({
from: 'Acme <[email protected]>',
to: ['[email protected]'],
subject: 'Ласкаво просимо в Acme!',
html: '<h1>Привіт!</h1><p>Дякуємо за реєстрацію.</p>',
});
if (error) {
console.error('Email error:', error);
}
З React Email шаблонами
import { Resend } from 'resend';
import { render } from '@react-email/render';
import WelcomeEmail from './emails/WelcomeEmail';
const resend = new Resend(process.env.RESEND_API_KEY);
export async function sendWelcomeEmail(user: { email: string; name: string }) {
const html = render(
<WelcomeEmail name={user.name} loginUrl="https://app.acme.com/login" />
);
await resend.emails.send({
from: 'Acme Team <[email protected]>',
to: user.email,
subject: 'Ласкаво просимо в Acme!',
html,
});
}
Батчева відправлення
// До 100 листів за один запит
await resend.batch.send([
{
from: '[email protected]',
to: '[email protected]',
subject: 'Ваш рахунок готовий',
html: invoiceHtml1,
},
{
from: '[email protected]',
to: '[email protected]',
subject: 'Ваш рахунок готовий',
html: invoiceHtml2,
},
]);
Webhooks для відстеження статусів
Resend відправляє webhooks при зміні статусу листа:
// POST /api/webhooks/resend
app.post('/api/webhooks/resend', express.raw({ type: 'application/json' }), async (req, res) => {
const signature = req.headers['resend-signature'];
// Верифікуємо підпис через svix
const event = JSON.parse(req.body);
switch (event.type) {
case 'email.sent':
await db.emailLogs.update({ emailId: event.data.email_id, status: 'sent' });
break;
case 'email.delivered':
await db.emailLogs.update({ emailId: event.data.email_id, status: 'delivered' });
break;
case 'email.bounced':
await db.users.markEmailBounced(event.data.to[0]);
break;
case 'email.complained':
await db.users.unsubscribe(event.data.to[0]);
break;
}
res.status(200).end();
});
Строки реалізації
Інтеграція з Resend та налаштування трансакційних email-шаблонів — 2–3 дня.