email API for Next.js

Resend is the most popular and developer-friendly email API for Next.js apps in 2026.

It is frequently recommended for Next.js (especially on Vercel) because of its excellent TypeScript SDK, native React Email support (write templates as React components), Edge Runtime compatibility, simple setup, and generous free tier.

Why Resend works especially well with Next.js

• Official Next.js guides and examples for both App Router and Pages Router.
• Send from Route Handlers (app/api/.../route.ts) or Server Actions (never from Client Components — that would expose your API key).
• React Email integration lets you pass a React component directly instead of raw HTML.
• Works in serverless/Edge environments (HTTP API, no SMTP issues on Vercel).
• Free tier: ~3,000 emails/month (100/day). Pro starts at $20/month for 50k emails.

Quick setup (App Router)

1. Install:

Bash

npm install resend

1. Add your API key to .env.local:

text

RESEND_API_KEY=re_xxxxxxxxx

1. Create a Route Handler (app/api/send/route.ts):

TypeScript

import { Resend } from 'resend';
import { EmailTemplate } from '@/components/email-template'; // optional React Email component

const resend = new Resend(process.env.RESEND_API_KEY);

export async function POST() {
  try {
    const { data, error } = await resend.emails.send({
      from: 'Acme <onboarding@resend.dev>', // use your verified domain in production
      to: ['delivered@resend.dev'],
      subject: 'Hello world',
      // Option A: React Email component
      react: EmailTemplate({ firstName: 'John' }),
      // Option B: plain HTML
      // html: '<p>It works!</p>',
    });

    if (error) {
      return Response.json({ error }, { status: 500 });
    }

    return Response.json(data);
  } catch (error) {
    return Response.json({ error }, { status: 500 });
  }
}

Or use a Server Action:

TypeScript

'use server';

import { Resend } from 'resend';

const resend = new Resend(process.env.RESEND_API_KEY);

export async function sendWelcomeEmail(email: string, name: string) {
  const { data, error } = await resend.emails.send({
    from: 'Your App <onboarding@yourdomain.com>',
    to: email,
    subject: `Welcome, ${name}`,
    html: `<p>Welcome ${name}!</p>`,
  });

  if (error) return { success: false, error: error.message };
  return { success: true, id: data?.id };
}

Official docs: resend.com/docs/send-with-nextjs

Other strong options for Next.js

Provider	Best for	Free tier	Notes
Resend	Modern DX + React Email	~3k emails/mo	Top recommendation for most Next.js apps
Postmark	Highest deliverability	Limited trial	Transactional-only focus
Notify	Ultra-simple fetch API	1k emails/mo	Minimal, flat pricing
SendGrid	Enterprise + marketing	Limited	Heavier, more features
Amazon SES	Lowest cost at high volume	Pay-as-you-go	More setup, AWS-native
Mailgun / Mailtrap	Testing + flexibility	Varies	Good for development

Nodemailer is still widely used but relies on SMTP, which is less ideal on Vercel (port restrictions, no Edge support). Prefer an HTTP-based API like Resend.

Key Next.js tips

• Always keep the API key server-side (Route Handler or Server Action).
• Verify your domain (SPF/DKIM/DMARC) for production deliverability.
• Use React Email (@react-email/components) for maintainable templates.
• For background/queued sends, combine with tools like Inngest or a job queue.

Would you like a full example with React Email templates, contact form integration, or a comparison focused on a specific use case (auth emails, transactional, marketing, etc.)?