Resend is the best choice for transactional email in a Next.js application. It was built by the React Email team, which means the templating story is excellent: you write email templates in JSX, render them to HTML, and send them via a clean API. For developers already working in React, this is the most natural email workflow available.
What Resend Is
Resend is an email API service designed specifically for developers. It was founded by the same team that built React Email, an open-source library for creating HTML email templates using React components. The two products work together: React Email handles the templating, Resend handles the delivery.
The pitch is simple: email should be easy to build and reliable to deliver. Resend focuses on developer experience over feature breadth. No marketing email campaigns, no contact list management, no analytics beyond the essentials. Just a reliable API for sending transactional email (welcome emails, password resets, invoice receipts, notifications).
React Email: Templates in JSX
React Email provides HTML email-safe React components. Building HTML email has always been painful because email clients (particularly Outlook) use ancient rendering engines that ignore modern CSS. React Email gives you components that render to table-based HTML that works across all email clients.
Install React Email:
npm install @react-email/components react react-dom
Write an email template:
import {
Html,
Head,
Body,
Container,
Text,
Button,
Heading,
} from "@react-email/components";
interface WelcomeEmailProps {
userName: string;
confirmUrl: string;
}
export function WelcomeEmail({ userName, confirmUrl }: WelcomeEmailProps) {
return (
<Html>
<Head />
<Body style={{ fontFamily: "Arial, sans-serif", backgroundColor: "#f4f4f4" }}>
<Container style={{ maxWidth: "600px", margin: "0 auto", backgroundColor: "#ffffff", padding: "24px" }}>
<Heading>Welcome, {userName}</Heading>
<Text>Thanks for signing up. Confirm your email to get started.</Text>
<Button href={confirmUrl} style={{ backgroundColor: "#000", color: "#fff", padding: "12px 24px" }}>
Confirm Email
</Button>
</Container>
</Body>
</Html>
);
}
You can preview this template locally with npx react-email dev, which starts a local server showing your email rendered in a browser.
Setting Up Resend
Install the Resend SDK:
npm install resend
Add your API key to .env:
RESEND_API_KEY=re_...
Send an email in a Next.js API route:
import { Resend } from "resend";
import { render } from "@react-email/render";
import { WelcomeEmail } from "@/emails/welcome";
const resend = new Resend(process.env.RESEND_API_KEY);
export async function POST(req: Request) {
const { userName, userEmail, confirmUrl } = await req.json();
const html = await render(WelcomeEmail({ userName, confirmUrl }));
const { data, error } = await resend.emails.send({
from: "Zlyqor <hello@yourapp.com>",
to: [userEmail],
subject: "Welcome to Zlyqor",
html,
});
if (error) {
return Response.json({ error }, { status: 400 });
}
return Response.json({ id: data?.id });
}
That is the complete integration. No SDK initialization ceremony, no complex configuration. Five lines to send an email.
Domain Verification
To send from your own domain (not a Resend test domain), you verify it through the Resend dashboard. Add the DNS records Resend provides (SPF, DKIM, DMARC), and Resend verifies ownership. Once verified, you can send from any address at your domain.
Domain verification is essential for deliverability. Sending from an unverified domain (or using a shared Resend domain in production) increases the chance your emails land in spam.
Email Logs, Webhooks, and Delivery Tracking
Resend's dashboard shows a log of every email sent: delivery status, opens, clicks, bounces, and spam complaints. For debugging email delivery issues, this is invaluable.
Resend supports webhooks for delivery events. You configure a webhook endpoint in the Resend dashboard, and Resend will POST to it when emails are delivered, opened, clicked, bounced, or marked as spam. This lets you update your database with email status:
export async function POST(req: Request) {
const event = await req.json();
if (event.type === "email.bounced") {
await markEmailBounced(event.data.email_id, event.data.to[0]);
}
return new Response("ok");
}
Pricing
Resend's free tier includes 3,000 emails per month and 100 emails per day. For early-stage products, this is sufficient. The Starter plan ($20/month) includes 50,000 emails per month. The Pro plan ($90/month) includes 250,000 emails per month. Additional emails are $1 per 1,000.
For context: if your SaaS sends welcome emails, password reset emails, invoice receipts, and weekly digest emails to 1,000 users, you might send 5,000-8,000 emails per month. The free tier covers the first 3,000, and the Starter plan ($20/month) covers everything up to 50,000.
Alternatives Comparison
Postmark is the traditional choice for transactional email. Excellent deliverability, been around since 2010, trusted by large companies. The DX is more traditional (no React Email equivalent in the Postmark ecosystem). Pricing is higher than Resend ($1.50 per 1,000 vs Resend's $1 per 1,000 on overage). Postmark is the right choice if you need battle-tested deliverability and want a vendor with a long track record.
SendGrid handles high-volume transactional and marketing email. More complex setup, more features, designed for scale. If you are sending millions of emails per month, SendGrid is worth evaluating. For most products under 1M emails/month, it is more tool than you need.
Mailgun is an API-first email service with a good developer API. Older DX than Resend, no React Email integration. The free tier was eliminated years ago, which makes it harder to get started than Resend. Mailgun is a reasonable choice if you prefer their infrastructure or have existing familiarity.
When Resend Wins
Resend is the clear choice for:
- Next.js applications (the React Email integration is native)
- Teams already working in React (email templates feel like regular component work)
- New projects that want a working email setup in one afternoon
- Products under 250,000 emails/month where you want simple pricing
For very high volume (10M+ emails/month) or complex marketing automation needs, Resend is not the right tool. For transactional email in a modern React codebase, it is the best available.
Keep Reading
- Next.js App Router Patterns 2026 — where to put email-sending logic in the App Router
- Clerk Auth Guide for Developers — pairing Clerk's auth events with Resend email notifications
- Stripe Integration Guide for Developers — sending invoice and receipt emails from Stripe webhooks
Pristren builds AI-powered software for teams. Zlyqor is our all-in-one workspace — chat, projects, time tracking, AI meeting summaries, and invoicing — in one tool. Try it free.
