RESEND_API_KEY=re_xxxx...

npm install resend @react-email/components

// apps/server/src/email-templates/welcome.tsx
import {
  Body,
  Container,
  Head,
  Heading,
  Html,
  Preview,
  Text,
} from '@react-email/components';
import * as React from 'react';

interface WelcomeEmailProps {
  username: string;
}

export const WelcomeEmail = ({ username }: WelcomeEmailProps) => (
  <Html>
    <Head />
    <Preview>Welcome to our platform!</Preview>
    <Body style={main}>
      <Container style={container}>
        <Heading style={h1}>Welcome, {username}!</Heading>
        <Text style={text}>
          We're excited to have you on board.
        </Text>
      </Container>
    </Body>
  </Html>
);

const main = {
  backgroundColor: '#ffffff',
  fontFamily: '-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif',
};

const container = {
  margin: '0 auto',
  padding: '20px 0 48px',
  maxWidth: '560px',
};

const h1 = {
  color: '#333',
  fontSize: '24px',
  fontWeight: '600',
  lineHeight: '40px',
  margin: '0 0 20px',
};

const text = {
  color: '#444',
  fontSize: '16px',
  lineHeight: '24px',
  margin: '0 0 20px',
};

export default WelcomeEmail;

// Example usage
import { sendEmail } from '@/services/email';
import WelcomeEmail from '@/email-templates/welcome';

await sendEmail({
  to: 'user@example.com',
  subject: 'Welcome to our platform',
  from: 'noreply@yourdomain.com',
  react: WelcomeEmail({ username: 'John' }),
});

interface SendEmailOptions {
  to: string;
  subject: string;
  text?: string;
  username?: string;
  from: string;
  react?: React.ReactNode;
  html?: string;
}

export async function sendEmail({
  to,
  subject,
  text,
  from,
  react,
  html,
}: SendEmailOptions) {
  try {
    const { data, error } = await resend.emails.send({
      from,
      to,
      subject,
      react,
      html,
    });

    if (error) {
      return error;
    }
    return {
      message: "Email sent",
      result: data,
    };
  } catch (error) {
    console.error("Failed to send email:", error);
    throw new Error("Failed to send email");
  }
}

    await sendEmail({
        to: user.email,
        subject: "Verify your email",
        from: "onboarding@resend.dev",
        html: getVerifyEmailHtml(
            user.name || user.email?.split("@")[0] || "User",
             "Better Boilerplate",
            process.env.CORS_ORIGIN as string,
            token,
        ),
    });

import { ResetPasswordEmail } from '@/email-templates/reset-password';

await sendEmail({
  to: user.email,
  subject: 'Reset Your Password',
  from: 'noreply@yourdomain.com',
  react: ResetPasswordEmail({ resetLink: resetUrl }),
});