Skip to main content

Use this pre-built prompt to get started faster.

CursorOpen in Cursor

Prerequisites

To get the most out of this guide, you’ll need to: Prefer watching a video? Check out our video walkthrough below.

1. Install

Get the Resend Node.js SDK.
npm install resend

2. Create an email template

Start by creating your email template on components/email-template.tsx.
components/email-template.tsx
import * as React from 'react';

interface EmailTemplateProps {
  firstName: string;
}

export function EmailTemplate({ firstName }: EmailTemplateProps) {
  return (
    <div>
      <h1>Welcome, {firstName}!</h1>
    </div>
  );
}

3. Send email using React

Create a route file under app/api/send/route.ts (or pages/api/send.ts if you’re using Pages Router). Import the React email template and send an email using the react parameter.
import { EmailTemplate } from '../../../components/email-template';
import { Resend } from 'resend';

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>',
      to: ['delivered@resend.dev'],
      subject: 'Hello world',
      react: EmailTemplate({ firstName: 'John' }),
    });

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

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

4. Try it yourself

Next.js (TypeScript)

Full-stack Next.js app with TypeScript

Next.js (JavaScript)

Full-stack Next.js app with JavaScript

Attachments

Send emails with file attachments

React Email

Send emails with React Email components

Templates

Send emails using Resend hosted templates

Scheduling

Schedule emails for future delivery

Double Opt-in

Double opt-in subscription flow

Inbound Webhooks

Receive and process inbound emails

Prevent Threading

Prevent email threading on Gmail

Audiences

Manage contacts and audiences

Domains

Create and manage sending domains

Better Auth

Email authentication with Better Auth