How to Send Emails from Your App (2026)

Every app needs email: welcome messages, password resets, receipts, notifications. Here's the practical guide to setting up email sending in 2026 — from choosing a provider to avoiding the spam folder.

Choose Your Provider

Provider	Best For	Free Tier	Pricing
Resend	Developer-first, React Email	3,000/mo	$20/mo for 50K
Postmark	Deliverability, transactional	100/mo	$15/mo for 10K
SendGrid	Volume, marketing + transactional	100/day	$20/mo for 50K
AWS SES	Cheapest at scale	62K/mo (from EC2)	$0.10/1K emails

For most apps: Resend. Best DX, React Email support, good free tier. Use Postmark if deliverability is critical (password resets, receipts). Use SES if you send millions.

Step 1: Set Up Resend

npm install resend

// lib/email.ts
import { Resend } from 'resend'

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

Step 2: Send Your First Email

await resend.emails.send({
  from: 'Your App <hello@yourapp.com>',
  to: 'user@example.com',
  subject: 'Welcome to Your App',
  html: '<h1>Welcome!</h1><p>Thanks for signing up.</p>',
})

That's it. Email sent.

Step 3: Build Beautiful Emails with React Email

Install React Email:

npm install @react-email/components

Create email templates as React components:

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

interface WelcomeEmailProps {
  name: string
  loginUrl: string
}

export default function WelcomeEmail({ name, loginUrl }: WelcomeEmailProps) {
  return (
    <Html>
      <Head />
      <Body style={{ fontFamily: 'sans-serif', background: '#f6f6f6' }}>
        <Container style={{ background: '#fff', padding: '40px', borderRadius: '8px' }}>
          <Heading>Welcome, {name}!</Heading>
          <Text>Thanks for signing up. Here's what you can do next:</Text>
          <ul>
            <li>Set up your first project</li>
            <li>Invite your team</li>
            <li>Explore the dashboard</li>
          </ul>
          <Hr />
          <Button href={loginUrl} style={{ background: '#000', color: '#fff', padding: '12px 24px', borderRadius: '6px' }}>
            Go to Dashboard
          </Button>
        </Container>
      </Body>
    </Html>
  )
}

Send with Resend:

import WelcomeEmail from '@/emails/welcome'

await resend.emails.send({
  from: 'Your App <hello@yourapp.com>',
  to: user.email,
  subject: 'Welcome to Your App',
  react: <WelcomeEmail name={user.name} loginUrl="https://yourapp.com/dashboard" />,
})

Step 4: Domain Authentication (Critical)

Without domain authentication, your emails go to spam. Set up these DNS records:

SPF Record

Type: TXT
Host: @
Value: v=spf1 include:resend.com ~all

DKIM Record

Resend provides this in the dashboard. Copy the CNAME records to your DNS.

DMARC Record

Type: TXT
Host: _dmarc
Value: v=DMARC1; p=quarantine; rua=mailto:dmarc@yourapp.com

Custom Return-Path

Set a custom bounce domain for best deliverability.

Without these DNS records, your emails will hit spam folders. This is the most important step.

Step 5: Common Email Types

Password Reset

await resend.emails.send({
  from: 'Your App <security@yourapp.com>',
  to: user.email,
  subject: 'Reset Your Password',
  react: <PasswordResetEmail resetUrl={resetUrl} />,
})

Receipt / Invoice

await resend.emails.send({
  from: 'Your App <billing@yourapp.com>',
  to: user.email,
  subject: `Receipt for $${amount}`,
  react: <ReceiptEmail amount={amount} date={date} items={items} />,
})

Notification

await resend.emails.send({
  from: 'Your App <notifications@yourapp.com>',
  to: user.email,
  subject: `${commenter.name} commented on your project`,
  react: <CommentNotificationEmail comment={comment} projectUrl={url} />,
})

Deliverability Tips

DO:

Authenticate your domain (SPF, DKIM, DMARC)
Use a subdomain for transactional email (e.g., mail.yourapp.com)
Include an unsubscribe link in marketing emails
Send from a real address that accepts replies
Keep HTML clean and simple
Test with mail-tester.com before launch

DON'T:

Send from a free email address (gmail, yahoo)
Include too many links or images
Use ALL CAPS or spam trigger words in subjects
Send to purchased email lists
Ignore bounce and complaint rates

Background Email Processing

Don't send emails in API request handlers — it slows down responses. Use a background job:

// With Trigger.dev or Inngest
import { inngest } from '@/lib/inngest'

// Define the function
export const sendWelcomeEmail = inngest.createFunction(
  { id: 'send-welcome-email' },
  { event: 'user/created' },
  async ({ event }) => {
    await resend.emails.send({
      to: event.data.email,
      subject: 'Welcome!',
      react: <WelcomeEmail name={event.data.name} />,
    })
  },
)

// Trigger it
await inngest.send({ name: 'user/created', data: { email, name } })

FAQ

How do I avoid the spam folder?

Domain authentication (SPF, DKIM, DMARC) is 90% of the battle. The rest: clean HTML, good sender reputation, and not sending to invalid addresses.

Resend vs SendGrid?

Resend: better DX, React Email support, modern API. SendGrid: more features (marketing campaigns, templates), larger scale. For transactional email, Resend wins.

How many emails can I send for free?

Resend: 3,000/month. SendGrid: 100/day (~3,000/month). AWS SES: 62,000/month from EC2. Enough for most early-stage apps.

Do I need both transactional and marketing email?

Start with transactional only (Resend). Add marketing email (beehiiv, ConvertKit) later when you have a newsletter strategy.

Bottom Line

Use Resend + React Email for transactional email. Authenticate your domain (SPF, DKIM, DMARC). Send emails in background jobs. Test deliverability before launch. The entire setup takes under an hour.