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:

1. Install

Get the Resend Node.js SDK.
npm install resend

2. Create an email template

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

interface EmailTemplateProps {
  firstName: string;
}

export function EmailTemplate({ firstName }: EmailTemplateProps) {
  return (
    <div>
      <h1>Welcome, {firstName}!</h1>
    </div>
  );
}
To use JSX/TSX with Hono, we need to modify the tsconfig.json.
tsconfig.json
{
  "compilerOptions": {
    "jsx": "react-jsx",
    "jsxImportSource": "react"
  }
}

3. Send email using React

Create a new file index.tsx and send your first email.
index.tsx
import { Hono } from 'hono';
import { Resend } from 'resend';
import { EmailTemplate } from './emails/email-template';

const app = new Hono();
const resend = new Resend('re_xxxxxxxxx');

app.get('/', async (c) => {
  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 c.json(error, 400);
  }

  return c.json(data);
});

export default app;

4. Try it yourself

Basic Send

Basic email sending

Attachments

Send emails with file attachments

Inline Images (CID)

Embed inline images using CID

Templates

Send emails using Resend hosted templates

Scheduling

Schedule emails for future delivery

Prevent Threading

Prevent email threading on Gmail

Audiences

Manage contacts and audiences

Domains

Create and manage sending domains

Inbound Webhooks

Receive and process inbound emails

Double Opt-in

Double opt-in subscription flow