Skip to main content

​
Send Email with Bun

This guide shows you how to send transactional emails using Sequenzy in a Bun application.

​
Prerequisites

​
1. Install

Install the Sequenzy SDK: 
bun add sequenzy

​
2. Create an Email Template

Create a React Email component for your email template:
email-template.tsx
import * as React from "react";

interface WelcomeEmailProps {
  firstName: string;
}

export function WelcomeEmail({ firstName }: WelcomeEmailProps) {
  return (
    <div>
      <h1>Welcome, {firstName}!</h1>
      <p>Thanks for signing up. We're excited to have you on board.</p>
    </div>
  );
}
You can use React Email components to build beautiful, responsive email templates. See our React Email guide below for more details.

​
3. Send the Email

Create your Bun server and send an email:
index.tsx
import Sequenzy from "sequenzy";
import { render } from "@react-email/render";
import { WelcomeEmail } from "./email-template";

const client = new Sequenzy({
  apiKey: process.env.SEQUENZY_API_KEY!,
});

const server = Bun.serve({
  port: 3000,
  async fetch() {
    const { data, error } = await client.transactional.send({
      to: "user@example.com",
      subject: "Welcome to Our Platform!",
      body: await render(WelcomeEmail({ firstName: "John" })),
    });

    if (error) {
      return new Response(JSON.stringify({ error }), { status: 400 });
    }

    return new Response(JSON.stringify({ data }));
  },
});

console.log(`Server running at http://localhost:${server.port}`);

​
4. Run

Start your server: 
bun run index.tsx
Visit http://localhost:3000 to trigger the email.

​
Using Templates

Instead of rendering HTML directly, you can use pre-built templates from the Sequenzy dashboard: 
const { data, error } = await client.transactional.send({
  to: "user@example.com",
  slug: "welcome-email",
  variables: {
    firstName: "John",
    dashboardUrl: "https://app.example.com/dashboard",
  },
});

​
Using React Email

React Email provides a set of components for building responsive emails. Install it alongside Sequenzy: 
bun add @react-email/components @react-email/render
Create a more sophisticated template:
email-template.tsx
import {
  Body,
  Button,
  Container,
  Head,
  Heading,
  Html,
  Preview,
  Text,
} from "@react-email/components";
import * as React from "react";

interface WelcomeEmailProps {
  firstName: string;
  dashboardUrl: string;
}

export function WelcomeEmail({ firstName, dashboardUrl }: WelcomeEmailProps) {
  return (
    <Html>
      <Head />
      <Preview>Welcome to our platform</Preview>
      <Body style={{ fontFamily: "sans-serif", padding: "20px" }}>
        <Container>
          <Heading>Welcome, {firstName}!</Heading>
          <Text>
            Thanks for signing up. Get started by visiting your dashboard:
          </Text>
          <Button
            href={dashboardUrl}
            style={{
              backgroundColor: "#c95a3c",
              color: "white",
              padding: "12px 24px",
              borderRadius: "6px",
            }}
          >
            Go to Dashboard
          </Button>
        </Container>
      </Body>
    </Html>
  );
}
Then render and send: 
import { render } from "@react-email/render";
import { WelcomeEmail } from "./email-template";

const html = await render(
  WelcomeEmail({
    firstName: "John",
    dashboardUrl: "https://app.example.com/dashboard",
  })
);

await client.transactional.send({
  to: "user@example.com",
  subject: "Welcome to Our Platform!",
  body: html,
});

​
Next Steps

React Email Components

Explore all available React Email components

Transactional Emails

Learn more about transactional emails