Infrastructure

Resend: Sending Emails

Make your app send beautiful emails — confirmations, notifications, and more

When someone signs up for your app, buys your product, or resets their password, they expect an email. Resend is a service that sends those emails for you. You tell it who to send to, what to say, and it handles delivery, spam prevention, and making sure your email actually lands in the inbox (not the junk folder).

What kind of emails are we talking about?

There are two kinds of email. Marketing emails are newsletters and promotions sent to a list (tools like Mailchimp handle those). Transactional emails are triggered by something the user does — that's what Resend is for.

"Welcome to [your app]!" after someone signs up
"Here's your password reset link"
"Your order has shipped" with tracking info
"Someone commented on your post" notifications
Receipts and invoices after a purchase

Getting started (no code)

Sign up at resend.com
Find your API key in the dashboard — it looks like re_abc123...
Use the API playground in the Resend dashboard to send a test email to yourself
That's literally it for your first email — no code needed

An API key is like a password that lets your code talk to Resend's service. Keep it secret — don't put it in code that others can see. Store it as an environment variable (see Guide #7).

Sending emails from code

When you're ready to send emails from your app programmatically:

Install the library: npm install resend
In your code: const resend = new Resend('re_your_key');
Send: await resend.emails.send({ from: 'you@yourdomain.com', to: 'user@email.com', subject: 'Welcome!', html: '<p>Thanks for joining!</p>' });

This code runs on your server (not in the browser), because it contains your API key. If you're using Vercel, put it in a serverless function (a file in the api/ folder).

Claude Code can do this for you

Ask Claude Code: "Set up Resend so this app sends a welcome email when someone signs up" — it will install the library, create the email function, and wire it up to your sign-up flow.

Setting up your domain

By default, Resend can only send emails to you (for testing). To send to real users, you need to verify that you own the email domain you're sending from.

In the Resend dashboard, go to Domains → Add Domain
Enter your domain (e.g., yourdomain.com)
Resend gives you DNS records to add — these are settings you configure where you bought your domain (like Namecheap, Google Domains, or Cloudflare)
The records prove to email providers that you're allowed to send from that address
Once verified (can take minutes to hours), you can send to anyone

DNS records are settings that control how your domain works on the internet. Don't worry — Resend gives you the exact values to copy-paste. You don't need to understand DNS deeply to set this up.

Making your emails look good

Plain text emails work fine, but if you want beautiful HTML emails, Resend has a companion library called React Email that lets you design email templates as React components.

Install: npm install @react-email/components
Build your email template as a React component (with headings, images, buttons)
Preview it in your browser while you design
Pass the component to Resend instead of raw HTML

Claude Code can do this for you

Ask Claude Code: "Create a welcome email template using React Email" — it will scaffold the component, add preview support, and wire it to Resend.

What does it cost?

Free tier: 3,000 emails/month and 1 custom domain
That's plenty for side projects and small apps
Paid plans start at $20/month for higher volumes

Try this now

Sign up for Resend, find the API playground in the dashboard, and send a test email to yourself. Read it in your inbox. That's your app's first email.

← Guide 9 All Guides