Skip to main content

Best Boilerplate with Email System: ShipFast vs Supastarter vs Makerkit

·StarterPick Team
emailtransactionalsaas boilerplatecomparisonresend

Email Makes or Breaks Your SaaS

Users don't just interact with your SaaS through the UI — they interact through their inbox. Welcome emails, password resets, billing receipts, trial ending reminders, feature announcements, and usage alerts. The quality and reliability of these emails directly affects retention and revenue.

Most boilerplates include "email support" — but the depth varies enormously. Some give you a pre-configured Resend integration with React Email templates. Others give you a string interpolation function and call it email.

We compared how ShipFast, Supastarter, and Makerkit handle email — from provider integration to template quality to the developer experience of adding new email types.

TL;DR

Makerkit has the best email developer experience — a mailer plugin with React Email templates, type-safe props, and clean provider abstraction (Resend, Nodemailer, or custom). Supastarter offers comprehensive email with templates for the full user lifecycle (welcome, billing, team invites, trial reminders). ShipFast provides functional Resend integration with basic templates. Choose Makerkit for DX. Choose Supastarter for completeness. Choose ShipFast for simplicity.

Key Takeaways

  • All three use Resend as the default email provider — the modern choice with React Email support.
  • Makerkit's mailer plugin is the cleanest architecture — isolated email logic, type-safe templates, provider-agnostic design.
  • Supastarter covers more email types — welcome, billing changes, team invitations, trial reminders, payment failures.
  • ShipFast's emails work but are basic — functional templates without the architectural depth of Makerkit or Supastarter.
  • React Email is the template standard — all three use it. Write email templates as React components with Tailwind.
  • Email deliverability is a provider concern, not a boilerplate concern. All three work with any email provider that accepts API calls.

Email Feature Comparison

Email Types Included

Email TypeShipFastSupastarterMakerkit
Welcome / signup
Email verification
Password reset
Magic link login
Subscription created
Payment receipt⚠️ Via Stripe✅ Custom✅ Custom
Payment failed
Trial ending reminder⚠️ Manual
Subscription cancelled⚠️ Via Stripe✅ Custom✅ Custom
Team invitationN/A
Team member joinedN/A⚠️ Manual
Feature announcement⚠️ Manual
Usage alert

Supastarter covers the most email scenarios. ShipFast handles auth and basic billing. Makerkit is in between — solid foundation with easy extensibility.

Provider Support

ProviderShipFastSupastarterMakerkit
Resend✅ Default✅ Default✅ Default
SendGrid⚠️ Manual swap⚠️ Manual swap✅ Provider plugin
Postmark⚠️ Manual swap⚠️ Manual swap✅ Provider plugin
AWS SES⚠️ Manual swap⚠️ Manual swap✅ Provider plugin
Nodemailer (SMTP)⚠️ Manual✅ Plugin

Makerkit's provider abstraction is the cleanest — switch email providers by installing a different plugin, not rewriting send logic.

Template System

FeatureShipFastSupastarterMakerkit
React Email templates
Type-safe template props⚠️ Basic✅ Full
Template preview (dev)⚠️ Manual
Responsive design
Dark mode support⚠️ Basic
Brand customization⚠️ Manual✅ Config-based✅ Config-based
Inline CSS✅ (React Email)✅ (React Email)✅ (React Email)

Architecture Comparison

ShipFast: Direct Resend Integration

// libs/resend.ts
import { Resend } from 'resend';
const resend = new Resend(process.env.RESEND_API_KEY);

// Usage in API route
await resend.emails.send({
  from: 'noreply@yourapp.com',
  to: user.email,
  subject: 'Welcome to YourApp!',
  react: WelcomeEmail({ name: user.name }),
});

Simple and functional. The Resend SDK is called directly wherever you need to send email. Templates are React components in a /emails directory.

Pros: Simple to understand, easy to modify. Cons: Email logic is scattered across API routes. No abstraction — switching providers requires finding and updating every resend.emails.send() call.

Supastarter: Organized Email Service

// packages/email/src/emails.ts
export const emails = {
  welcome: (props: WelcomeProps) => ({
    subject: `Welcome to ${config.appName}!`,
    react: WelcomeEmail(props),
  }),
  teamInvite: (props: InviteProps) => ({
    subject: `You've been invited to ${props.teamName}`,
    react: TeamInviteEmail(props),
  }),
  paymentFailed: (props: PaymentProps) => ({
    subject: 'Action needed: Payment failed',
    react: PaymentFailedEmail(props),
  }),
};

// Usage
await sendEmail({
  to: user.email,
  ...emails.welcome({ name: user.name, verifyUrl }),
});

Emails are defined in a centralized service. Templates and subjects live together. The sendEmail function handles provider logic.

Pros: Centralized email definitions, consistent patterns, comprehensive lifecycle coverage. Cons: More files to navigate. Provider abstraction is less clean than Makerkit's plugin approach.

Makerkit: Plugin-Based Mailer

// packages/email/src/mailer.ts
export class Mailer {
  constructor(private provider: EmailProvider) {}

  async send<T extends keyof EmailTemplates>(
    template: T,
    props: EmailTemplateProps[T],
    to: string
  ) {
    const { subject, react } = this.templates[template](props);
    return this.provider.send({ to, subject, react });
  }
}

// Instantiate with any provider
const mailer = new Mailer(new ResendProvider());
// or
const mailer = new Mailer(new NodemailerProvider(smtpConfig));

// Usage — type-safe template + props
await mailer.send('welcome', { name: user.name }, user.email);
// TypeScript error if 'welcome' template doesn't have a 'name' prop

Pros: Provider-agnostic (swap without code changes), type-safe (template names and props are validated), testable (mock the provider in tests). Cons: More abstraction layers. Slightly more setup for simple use cases.


React Email Templates

All three boilerplates use React Email, which lets you build email templates as React components:

import { Html, Head, Body, Container, Text, Button, Img } from '@react-email/components';

export function WelcomeEmail({ name, loginUrl }: { name: string; loginUrl: string }) {
  return (
    <Html>
      <Head />
      <Body style={body}>
        <Container style={container}>
          <Img src="https://yourapp.com/logo.png" width={120} alt="YourApp" />
          <Text style={heading}>Welcome, {name}!</Text>
          <Text style={paragraph}>
            Thanks for signing up. Click below to get started:
          </Text>
          <Button style={button} href={loginUrl}>
            Open Dashboard
          </Button>
        </Container>
      </Body>
    </Html>
  );
}

React Email renders to HTML with inline CSS — compatible with every email client. You develop with React's component model but produce email-safe HTML.


Email Deliverability Considerations

The boilerplate doesn't affect deliverability — your email provider and domain configuration do. But here's what each boilerplate helps with:

FactorShipFastSupastarterMakerkit
SPF/DKIM setup guide⚠️ Basic
From address configuration
Reply-to configuration⚠️ Manual
Unsubscribe header⚠️ Manual⚠️ Manual
Bounce handling⚠️ Via provider⚠️ Via provider
Email queue/retry⚠️ Manual⚠️ Manual

All three leave bounce handling and retry logic to the email provider. Resend, SendGrid, and Postmark handle retries automatically. For production SaaS, this is usually sufficient.


When to Choose Each

Choose Makerkit If:

  • Email architecture matters — clean provider abstraction, type-safe templates, testable design
  • You might switch providers — Resend → SendGrid → SES without code changes
  • You want type-safe email — template names and props validated by TypeScript
  • Testing email is important — mock the provider, test the template logic

Choose Supastarter If:

  • You need comprehensive email coverage — every lifecycle email from signup to cancellation
  • Team-related emails are important — invitations, member joins, role changes
  • You want emails included from day one — less setup, more pre-built templates
  • Billing emails are critical — payment failures, trial reminders, receipt customization

Choose ShipFast If:

  • Simple email is enough — welcome, auth, and basic billing emails
  • You'll customize heavily anyway — ShipFast's simple integration is easy to modify
  • Resend is your provider — direct integration with no abstraction overhead
  • Speed to market matters — email works out of the box, optimize later

Compare email features across 50+ boilerplates on StarterPick — filter by email provider, template system, and lifecycle coverage.

Check out this boilerplate

View Makerkit on StarterPick →

Comments