> resend

You are an expert in Resend, the developer-first email API. You help developers send transactional and marketing emails using React Email templates, TypeScript SDK, webhooks for delivery tracking, batch sending, and audience management — replacing legacy email services (SendGrid, Mailgun) with a modern, type-safe developer experience.

fetch

$curl "https://skillshub.wtf/TerminalSkills/skills/resend?format=md"

SKILL.md•resend

Resend — Modern Email API for Developers

Core Capabilities

Sending Emails

import { Resend } from "resend";
import { WelcomeEmail } from "@/emails/welcome";

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

// Send with React Email template
const { data, error } = await resend.emails.send({
  from: "Acme <noreply@acme.com>",
  to: "user@example.com",
  subject: "Welcome to Acme",
  react: WelcomeEmail({ name: "Alice", loginUrl: "https://app.acme.com" }),
});

// Send with HTML
await resend.emails.send({
  from: "Acme <noreply@acme.com>",
  to: ["user1@example.com", "user2@example.com"],
  cc: "admin@acme.com",
  bcc: "archive@acme.com",
  subject: "Your invoice",
  html: "<h1>Invoice #123</h1><p>Amount: $99.99</p>",
  attachments: [{
    filename: "invoice.pdf",
    content: pdfBuffer,
  }],
  tags: [
    { name: "category", value: "billing" },
    { name: "user_id", value: "usr-42" },
  ],
});

// Batch send
const { data } = await resend.batch.send([
  { from: "noreply@acme.com", to: "user1@example.com", subject: "Digest", react: DigestEmail({ items: user1Items }) },
  { from: "noreply@acme.com", to: "user2@example.com", subject: "Digest", react: DigestEmail({ items: user2Items }) },
]);

// Schedule
await resend.emails.send({
  from: "noreply@acme.com",
  to: "user@example.com",
  subject: "Reminder",
  react: ReminderEmail({}),
  scheduledAt: "2026-03-15T09:00:00Z",    // Send at specific time
});

React Email Templates

// emails/welcome.tsx — Type-safe email templates
import { Html, Head, Body, Container, Heading, Text, Button, Hr, Img } from "@react-email/components";

interface WelcomeEmailProps {
  name: string;
  loginUrl: string;
}

export function WelcomeEmail({ name, loginUrl }: WelcomeEmailProps) {
  return (
    <Html>
      <Head />
      <Body style={{ fontFamily: "Arial, sans-serif", backgroundColor: "#f4f4f5" }}>
        <Container style={{ maxWidth: 600, margin: "0 auto", padding: 20, backgroundColor: "#fff" }}>
          <Img src="https://acme.com/logo.png" width={120} height={40} alt="Acme" />
          <Heading as="h1">Welcome, {name}!</Heading>
          <Text>Thanks for signing up. Get started by logging in:</Text>
          <Button
            href={loginUrl}
            style={{ backgroundColor: "#000", color: "#fff", padding: "12px 24px", borderRadius: 6 }}>
            Get Started
          </Button>
          <Hr />
          <Text style={{ fontSize: 12, color: "#666" }}>
            If you didn't create this account, ignore this email.
          </Text>
        </Container>
      </Body>
    </Html>
  );
}

// Preview: npx email dev (opens browser preview at localhost:3000)

Installation

npm install resend
npm install @react-email/components react-email  # For templates
npx email dev                              # Preview templates

Best Practices

React Email templates — Build emails with React components; type-safe, previewable, reusable
Tags for analytics — Add tags to every email; track delivery rates by category, campaign, user segment
Webhooks for tracking — Set up webhooks for delivered/bounced/complained events; update user records
Batch for volume — Use batch.send for newsletters/digests; up to 100 emails per batch call
Domain verification — Verify your sending domain with DNS records (SPF, DKIM, DMARC); improves deliverability
Preview before send — Use npx email dev to preview templates in the browser; iterate fast
Scheduled sends — Use scheduledAt for time-zone-aware delivery; better open rates
Error handling — Check error in response; handle bounces gracefully, update user preferences

> related_skills --same-repo

> zustand

You are an expert in Zustand, the small, fast, and scalable state management library for React. You help developers manage global state without boilerplate using Zustand's hook-based stores, selectors for performance, middleware (persist, devtools, immer), computed values, and async actions — replacing Redux complexity with a simple, un-opinionated API in under 1KB.

> zoho

Integrate and automate Zoho products. Use when a user asks to work with Zoho CRM, Zoho Books, Zoho Desk, Zoho Projects, Zoho Mail, or Zoho Creator, build custom integrations via Zoho APIs, automate workflows with Deluge scripting, sync data between Zoho apps and external systems, manage leads and deals, automate invoicing, build custom Zoho Creator apps, set up webhooks, or manage Zoho organization settings. Covers Zoho CRM, Books, Desk, Projects, Creator, and cross-product integrations.

> zod

You are an expert in Zod, the TypeScript-first schema declaration and validation library. You help developers define schemas that validate data at runtime AND infer TypeScript types at compile time — eliminating the need to write types and validators separately. Used for API input validation, form validation, environment variables, config files, and any data boundary.

> zipkin

Deploy and configure Zipkin for distributed tracing and request flow visualization. Use when a user needs to set up trace collection, instrument Java/Spring or other services with Zipkin, analyze service dependencies, or configure storage backends for trace data.

┌ stats

installs/wk0

░░░░░░░░░░

github stars17

███░░░░░░░

first seenMar 17, 2026

└────────────

┌ repo

TerminalSkills/skills

by TerminalSkills

└────────────

┌ tags

#ai #frontend #backend #typescript

└────────────