Email Delivery API Reference
Table of Contents
Overview
The Email Delivery Plugin helps you send emails easily in your FastStartup project. It uses Resend and React Email to handle email delivery and templates.
No need to set things up from scratch—this plugin comes pre-configured to save you time.
Key Features
- Pre-configured email sending with Resend.
- Email templates powered by React Email.
- Easy-to-use
sendEmail
function for sending emails. - Simple setup using environment variables.
Use Cases
You can use the Email Delivery Plugin for:
- Sending transactional emails (welcome emails, password resets).
- Delivering marketing emails (newsletters, promotions).
- Automating customer emails like free resource delivery.
Getting Started
Follow these steps to start sending emails:
1. Install the Plugin
The Email Delivery Plugin is already part of the FastStartup framework. No extra installation is needed.
2. Set Environment Variables
Add your Resend API key and default sender email to the .env
file:
AUTH_RESEND_KEY=your-resend-api-key
NEXT_PUBLIC_RESEND_EMAIL=your-sender-email@example.com
Tip: You can get your Resend API key from Resend Dashboard.
3. Add Email Templates
Store your email templates in the following folder:
src/app/emails
Next, register the templates in the templates.ts
file:
// src/plugins/emailDelivery/resend/templates.ts
import { FreeEbookEmail } from "@/app/emails/FreeEbookEmail";
export const TEMPLATES = {
freeEbook: {
template: FreeEbookEmail,
},
};
4. Use sendEmail
Function
The sendEmail
function is ready to use and can be imported from:
import { sendEmail } from "@/plugins/emailDelivery/resend/actions";
Here’s how you use it:
sendEmail(
"recipient@example.com", // recipient's email
"Welcome to FastStartup", // subject line
"freeEbook", // template from TEMPLATES
{ name: "John Doe" } // template props
);
Example Template Component
An email template looks like a React component:
// src/app/emails/FreeEbookEmail.tsx
import { Html, Text, Heading } from "@react-email/components";
export const FreeEbookEmail = ({ name }: { name: string }) => (
<Html>
<Heading>Hi {name},</Heading>
<Text>Here’s your free ebook as promised!</Text>
<Text>Enjoy reading.</Text>
</Html>
);
API Overview
sendEmail
A function for sending emails.
Parameters:
Parameter | Type | Description |
---|---|---|
to | string | Recipient's email address |
subject | string | Subject line of the email |
template | string | React email template key as specified in template.ts |
templateProps | object | Type-safe props passed to the email template component |
Example:
sendEmail("test@example.com", "Your Free Ebook", "freeEbook", {
name: "Jane",
});
Comparison to Alternatives
- Nodemailer: Requires more manual setup and configuration.
- SendGrid: Works well but can be expensive for smaller projects.
- Email Delivery Plugin: Pre-configured, simple, and free to start with Resend.
If you’re using FastStartup, this plugin is the easiest option.
FAQ
1. What is Resend? Resend is an email delivery service designed for developers. It’s reliable, fast, and easy to integrate.
2. Can I customize email templates? Yes! You can create React components for your templates and pass dynamic props to customize them.
3. How do I get my Resend API key? Sign up for Resend and grab your API key from the dashboard.
4. What if I don’t want to use React Email? You can still send plain text or HTML emails without React Email.
5. Is the plugin free? The plugin itself is free to use for FastStartup clients. Resend offers a free plan to start with.