How to Use Resend: The Beginner's Guide (First Domain, First Email, React Templates, and the Key You Keep Server-Side)

CodexFuse Team · 2026-10-31T03:57:27.257Z · 12 min read

Learn how to use Resend: verify your domain, create an API key, send your first email, build React email templates, and set up webhooks — all on the free tier.

How to Use Resend: The Beginner's Guide (First Domain, First Email, React Templates, and the Key You Keep Server-Side)

Learning how to use Resend is the fastest way to give your app real email. If your side project needs to send a welcome message, a password reset, or an order receipt, you have two options: fight your server's SMTP configuration for a weekend and still land in spam, or call one API that was built for exactly this job. This Resend tutorial for beginners walks the complete arc in one sitting: create an account, verify your domain with DNS records, create an API key you keep server-side, send your first email, build a React template, test without spamming anyone, and wire up webhooks so you know every email landed. If your app's backend is still a blank slate, pair this with the Supabase beginner guide — Supabase covers your database and auth, and Resend delivers the emails those flows need.

How Do I Use Resend?

You use Resend by verifying a domain you own, creating an API key, and calling resend.emails.send() from your server code. The key is never exposed in the browser, the from address belongs to your verified domain, and the whole beginner loop fits in an afternoon. Treat the list below as your Resend for beginners checklist:

1. Create your Resend account — sign up at resend.com on the free-forever plan: 3,000 emails a month, 100 a day, no trial to expire.
2. Verify your domain — add the DNS records Resend gives you (SPF, DKIM, and DMARC) at your domain registrar; Resend checks them automatically.
3. Create an API key — name it for its service and environment, copy it once, and store it as the RESEND_API_KEY environment variable. Never paste it into frontend code or a public repo.
4. Send your first email — install the SDK (npm install resend) and call resend.emails.send() with a from address on your verified domain.
5. Test safely — use Resend's documented test addresses ([email protected], [email protected]) and the [email protected] test sender before you email a real user.
6. Go further — build templates as React components with React Email, add a webhook endpoint to track delivery, and handle errors with the { data, error } response pattern.

What Is Resend, Exactly?

Resend is an email API platform built for developers, designed to make sending transactional email — the welcome emails, password resets, receipts, and notifications your app triggers — as simple as one function call. Instead of configuring SMTP servers, managing connection pools, and debugging why Gmail flagged your server's IP, your server sends a JSON payload to https://api.resend.com/emails with a bearer API key, and Resend handles delivery. The platform ships official SDKs for Node.js, Python, Go, Ruby, PHP, and Elixir, plus framework guides for Next.js, Nuxt, and Express, and it pairs with React Email, the React-based email template library, so you write emails as components instead of 2005-era HTML tables.

The honest positioning is worth stating up front: Resend does one thing well — developer-first email sending. It is not a marketing-email suite with drag-and-drop newsletter builders. Resend draws a clean line between its two APIs: transactional emails go through the /emails API (triggered by user actions), while marketing emails go through the /broadcasts API or the Broadcasts dashboard. Broadcast emails only go to existing contacts, and they do not count against your transactional email quota — only /emails sends do. For a beginner building an app, that means the free tier covers exactly the emails your app needs to function.

How Does Resend's Free Tier Work?

Resend's free tier is a free-forever plan, not a time-limited trial — the pricing page's own FAQ answers "Is there a free trial available?" with "No, but we provide a free-forever plan." You get 3,000 emails per month and up to 100 emails per day, 3 domains, 3 inboxes, ticket support, 30-day data retention, and 1 webhook endpoint. Open and click tracking is included on the Free plan as a per-domain setting, which is unusual — many providers gate engagement tracking behind paid tiers. These numbers were verified on resend.com/pricing on October 30, 2026.

Do the math on the daily cap before you plan a launch: 100 emails a day means the free tier suits early products — a few hundred users signing up, resetting passwords, and getting receipts. A launch-day spike past 100 emails waits for the next day on Free, or you upgrade to Pro, which removes the daily limit entirely. Note also that test emails count against your account's sending quota, per the Resend docs, so your [email protected] experiments are not unlimited — they are cheap, not free.

How Do I Verify a Domain in Resend?

Resend domain verification is how inbox providers learn to trust your mail, and Resend will not let you send production email until you complete it. You must add and verify at least one domain you own — a domain you control, not a shared or public one — and Resend gives you the exact DNS records to add at your registrar: SPF, DKIM, and DMARC records. Add them, and Resend verifies them automatically; there is nothing to email back or paste into a form. This step exists because email authentication is what keeps your messages out of spam folders — SPF authorizes Resend's servers to send for your domain, DKIM cryptographically signs each message, and DMARC tells providers what to do when checks fail.

One recommendation from Resend's own domain docs deserves attention: send from a subdomain like updates.example.com instead of your root domain. Two reasons. First, reputation isolation — if your marketing emails ever get marked as spam, your transactional password resets on a separate subdomain keep their clean reputation. Second, clarity of intent — recipients and inbox providers can see at a glance what kind of email this is. Resend's docs also note that look-alike domains (like example-alerts.com instead of alerts.example.com) look suspicious to spam filters and recipients, so verify the real subdomain under your own root domain. Each subdomain is added and verified individually in the Domains dashboard.

DNS propagation is the step beginners underestimate. After adding the records, verification can take minutes or — at slow registrars — longer. Use Resend's dashboard status as the source of truth, not your registrar's "records saved" message. While you wait, enable open and click tracking per domain in the dashboard, and consider enforced TLS so your emails only travel over encrypted connections.

How Do I Create a Resend API Key (and Keep It Server-Side)?

You create a Resend API key in the dashboard under API Keys: name the key for the service and environment it belongs to (for example, myapp-production), choose the least privilege the job needs — Resend supports send-only keys for apps that only deliver email — and copy the key immediately. Keys are shown once; if you lose it, you delete and create a new one rather than recovering the old. Resend API keys begin with re_, and Resend's docs state that keys do not expire automatically — rotation is your own process, so plan for it.

The key lives server-side, always. Store it as an environment variable — RESEND_API_KEY — in a .env file that is gitignored, or in your host's secrets manager, and pass it to the SDK constructor from there:

RESEND_API_KEY=re_your_key_here

Never put the key in browser JavaScript, a public repo, or a client-side bundle. A leaked key is a spending hole: anyone holding it can send email on your quota. If you keep your code on GitHub, our GitHub beginner guide covers the .gitignore habit that keeps secrets out of commits — add .env to it before you paste anything sensitive. And if you deploy in containers, our Docker beginner guide shows how environment variables flow into containers without baking them into images. This ordering matters: create the key, secure it, then write your first send.

How Do I Send My First Email with Resend?

You send your first email by installing the SDK and calling resend.emails.send() from server code — the official Node.js quickstart, verified on resend.com/docs on October 30, 2026, does it in one file:

npm install resend

import { Resend } from 'resend';

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

const { data, error } = await resend.emails.send({
  from: 'Acme <[email protected]>',
  to: ['[email protected]'],
  subject: 'Hello World',
  html: '<strong>It works!</strong>',
});

if (error) {
  return console.error({ error });
}

console.log({ data });

Three things to notice. First, the { data, error } response pattern: check error before you celebrate — a bad from address, an unverified domain, or a quota problem surfaces here, not as an exception. Second, data carries the email's ID on success; store it if you ever need to look the message up with support or match it to a webhook event later. Third, the quickstart's from address is [email protected] — Resend's testing-only sender — and it pairs with the [email protected] test address, which simulates a successful delivery without touching a real inbox. Swap in your verified domain's address for production sends.

For your own domain, the from line looks like 'Your App <[email protected]>' — the address must belong to a domain you verified in the previous step. Your app will run on a server somewhere, and if you are still choosing where that is, our what is VPS hosting guide explains the server side the email key will live on.

How Do I Test Without Spamming Anyone?

Resend gives you a documented test-email system so you never have to send to a real address during development. Four special recipients, each simulating a different outcome — verified on Resend's docs on October 30, 2026:

• [email protected] — simulates a successfully delivered email.
• [email protected] — simulates a bounce: the recipient's provider rejects it, generating an SMTP 550 5.1.1 "Unknown User" response, so you can test your bounce handling.
• [email protected] — simulates an email the recipient received but marked as spam, for testing complaint handling.
• [email protected] — simulates a suppressed email, where the suppression reason indicates the address previously bounced.

All four support plus-labeling — [email protected], [email protected] — so you can differentiate test scenarios in your logs, except [email protected], which does not support labeling yet. Two cautions from the docs: test emails count against your sending quota, and Resend warns against using fake addresses or fake SMTP servers for testing — use these documented addresses instead.

The [email protected] sender in the quickstart has one more rule beginners trip on: the resend.dev domain is testing-only and can send only to the email address associated with your own Resend account. Send to any other recipient and you get a 403 error: "You can only send testing emails to your own email address." One more piece of good news from the same docs: Resend has no sandbox mode or production approval process — every account, including free ones, gets immediate full production access with no waiting period, unlike providers that gate you behind approval tickets.

How Do I Build a React Email Template?

You build React email templates with React Email, the React-based template library that pairs with Resend, instead of hand-writing table-based HTML. Install it alongside the SDK:

npm install resend @react-email/components

Write the email as a component — a welcome email, for example:

// emails/welcome.tsx
import { Html, Head, Body, Container, Text, Button } from '@react-email/components';

export default function WelcomeEmail({ name, loginUrl }) {
  return (
    <Html>
      <Head />
      <Body>
        <Container>
          <Text>Welcome, {name}!</Text>
          <Button href={loginUrl}>Log in</Button>
        </Container>
      </Body>
    </Html>
  );
}

Then pass it to the send call through the react parameter instead of html:

import WelcomeEmail from './emails/welcome';

const { data, error } = await resend.emails.send({
  from: 'Acme <[email protected]>',
  to: ['[email protected]'],
  subject: 'Welcome aboard',
  react: WelcomeEmail({ name: 'Alex', loginUrl: 'https://app.example.com/login' }),
});

The template stays type-safe, hot-reloadable, and version-controlled with the rest of your code — and because it renders to email-safe HTML on the server, it works in the fussiest inboxes. That component-to-send flow is the Resend React Email workflow in full: write the component, pass it through the react parameter, and never hand-write email tables again. For a first template, keep it short: a greeting, one action button, and a footer with your physical mailing address where required by law. If you write your code in VS Code, our VS Code beginner guide gets the editor side set up.

How Do I Track Delivery with Resend Webhooks?

You track delivery by adding a webhook endpoint in the dashboard that receives an event every time an email is delivered, opened, clicked, bounced, or complained about — real-time events, not next-day batch reports. The Free plan includes 1 webhook endpoint, Pro includes 5, and Scale includes 10, with all events available on every plan. Point the endpoint at a route in your app (for example, a Next.js API route), verify the event signature so you know the payload really came from Resend, and log the events against the email ID from your original data response.

The events beginners use first are email.delivered (confirm the welcome email actually arrived), email.bounced (mark the address bad in your database so you stop sending to it), and email.complained (suppress the address immediately — repeated complaints hurt your domain's reputation). Build these three handlers before you add anything fancy; they are the difference between "emails go out" and "emails work."

What Do I Do When an Email Fails?

Every failure in Resend arrives in one of two places, and beginners should check them in this order. First, the error object from resend.emails.send(): a 403 with "You can only send testing emails to your own email address" means you used the [email protected] sender with a foreign recipient — switch to your verified domain or send to your own address. A validation error on the from address means the domain is not verified yet — finish the DNS step. Second, webhook events after a successful send: bounces and complaints arrive here, asynchronously, and your job is to act on them — mark bounced addresses, suppress complainers, and never re-send to a hard bounce.

Resend also maintains an automatic suppression list, which is why the [email protected] test address exists: addresses that previously bounced or complained get suppressed so you do not keep mailing them. The beginner version of this discipline is simple — listen to the events, update your database, and treat a bounce as information, not as a reason to retry.

Resend vs SendGrid vs Mailgun: What Should a Beginner Pick?

Beginners pick Resend when the priority is shipping email this week, not configuring an email platform. The three providers below are all legitimate; they differ in who they are built for:

The fair summary: if your app needs transactional email and you want the smallest possible path from zero to sent, Resend's free tier is the beginner lane. On the Resend vs Mailgun question specifically, the deciding factor is how much email infrastructure you want to think about: Mailgun hands you more knobs, Resend hands you fewer. If your roadmap includes big marketing programs from day one, evaluate SendGrid's or Mailgun's marketing tooling on its own merits — that is a different buying decision from "my app needs to send password resets."

What Are the Beginner Mistakes with Resend?

Frequently Asked Questions

Is Resend really free?

Yes — Resend's Free plan is free-forever, not a trial: 3,000 emails a month, up to 100 a day, 3 domains, and open/click tracking included, per resend.com/pricing. There is no credit-card trial to remember to cancel; you upgrade to Pro ($20/month, 50,000 emails) only when the free quotas stop fitting.

Can I send email from my Gmail address with Resend?

No. Resend requires the from address to belong to a domain you own and have verified with DNS records — you cannot use a Gmail, Outlook, or any other public address as the sender. The right move is to verify your own domain (even a cheap one) and send to your Gmail as the test recipient.

Does Resend need production approval like Amazon SES?

No. Resend's docs state there is no sandbox mode and no approval process — every account, including free accounts, gets immediate full production access. You verify your domain, create a key, and you can send to real recipients right away.

What is the difference between the /emails API and Broadcasts?

The /emails API sends transactional email — triggered by user actions like signups and purchases — and every send counts against your transactional quota. Broadcasts (the /broadcasts API or the dashboard) send marketing email to existing contacts only, handle the unsubscribe link for you, and do not count against your transactional limits.

How do I send the same email to many recipients at once?

Use Resend's Batch Email API, which sends up to 100 emails in a single request — and each batch request counts as only one request against your API rate limit, per the pricing FAQ. For newsletters to a contact list, use Broadcasts instead, which is built for that job.

Sources

• Resend pricing page (3,000 emails/month, 100/day, 3 domains, 1 webhook endpoint, free-forever plan, Pro $20/month, batch API, broadcast vs transactional quotas) — https://resend.com/pricing — crawled October 30, 2026
• Resend docs: Verified domains (domain ownership requirement, SPF/DKIM/DMARC records, sending-subdomain recommendation, per-domain open/click tracking) — https://resend.com/docs/dashboard/domains/introduction — updated October 29, 2026
• Resend docs: Send emails with Node.js (npm install resend, RESEND_API_KEY env var, resend.emails.send, {data, error} pattern, [email protected] → [email protected] quickstart) — https://resend.com/docs/send-with-nodejs — crawled October 30, 2026
• Resend docs: Send test emails + What email addresses to use for testing (delivered/bounced/complained/suppressed addresses, plus-labeling, quota counting) and 403 resend.dev domain rule (testing-only sender, own-address recipients) — https://resend.com/docs/dashboard/emails/send-test-emails — read October 30, 2026
• Resend API beginner guides for intent reference (Node.js/Next.js/Nuxt walkthroughs, key-format and SDK patterns) — https://apidog.com/blog/resend-api/ and https://www.anygen.io/showcase/resend-api/index.html — crawled October 30, 2026
• Community quick-starts confirming the free-tier numbers and React Email template pattern — https://dev.to/0012303/resend-has-a-free-email-api-send-3000-emailsmonth-with-3-lines-of-code-46im — crawled October 30, 2026