SKILL.md

name: Email Integration description: Transactional emails, templates, and email service integration

Email Integration Skill

Email Services

Resend (Recommended)

npm install resend

import { Resend } from 'resend';

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

export async function sendEmail({ to, subject, html }) {
  const { data, error } = await resend.emails.send({
    from: 'Smarter.Poker <noreply@smarter.poker>',
    to,
    subject,
    html
  });
  
  if (error) throw error;
  return data;
}

SendGrid

import sgMail from '@sendgrid/mail';
sgMail.setApiKey(process.env.SENDGRID_API_KEY);

await sgMail.send({
  to: 'user@example.com',
  from: 'noreply@smarter.poker',
  subject: 'Welcome to Smarter.Poker',
  html: '<h1>Welcome!</h1>'
});

Nodemailer (SMTP)

import nodemailer from 'nodemailer';

const transporter = nodemailer.createTransport({
  host: 'smtp.example.com',
  port: 587,
  auth: {
    user: process.env.SMTP_USER,
    pass: process.env.SMTP_PASS
  }
});

await transporter.sendMail({
  from: 'noreply@smarter.poker',
  to: 'user@example.com',
  subject: 'Test',
  html: '<p>Hello</p>'
});

React Email Templates

npm install @react-email/components react-email

// emails/welcome.tsx
import { Html, Head, Body, Container, Text, Button } from '@react-email/components';

export default function WelcomeEmail({ username }) {
  return (
    <Html>
      <Head />
      <Body style={main}>
        <Container>
          <Text>Welcome to Smarter.Poker, {username}!</Text>
          <Button href="https://smarter.poker/training">
            Start Training
          </Button>
        </Container>
      </Body>
    </Html>
  );
}

const main = {
  backgroundColor: '#f6f9fc',
  fontFamily: 'sans-serif'
};

Render Template

import { render } from '@react-email/render';
import WelcomeEmail from './emails/welcome';

const html = render(<WelcomeEmail username="Dan" />);

Common Email Types

Welcome Email

export const sendWelcomeEmail = async (user) => {
  await sendEmail({
    to: user.email,
    subject: 'Welcome to Smarter.Poker! 🎰',
    html: render(<WelcomeEmail user={user} />)
  });
};

Password Reset

export const sendPasswordReset = async (email, resetLink) => {
  await sendEmail({
    to: email,
    subject: 'Reset Your Password',
    html: render(<PasswordResetEmail resetLink={resetLink} />)
  });
};

Transaction Receipt

export const sendReceipt = async (user, purchase) => {
  await sendEmail({
    to: user.email,
    subject: `Receipt for Order #${purchase.id}`,
    html: render(<ReceiptEmail purchase={purchase} />)
  });
};

Supabase Auth Emails

Supabase handles auth emails automatically. Customize in:

Dashboard > Authentication > Email Templates

Best Practices

Use a verified sending domain (SPF, DKIM, DMARC)
Keep emails mobile-friendly
Include unsubscribe links for marketing
Track opens/clicks for analytics
Use transactional emails for user-triggered actions only

スコア

総合スコア

50/100

リポジトリの品質指標に基づく評価

✓SKILL.md

SKILL.mdファイルが含まれている

+20

○LICENSE

ライセンスが設定されている

0/10

○説明文

100文字以上の説明がある

0/10

○人気

GitHub Stars 100以上

0/15

○最近の活動

3ヶ月以内に更新がある

0/10

○フォーク

10回以上フォークされている

0/5

✓Issue管理

オープンIssueが50未満

+5

✓言語

プログラミング言語が設定されている

+5

○タグ

1つ以上のタグが設定されている

0/5

レビュー

💬

レビュー機能は近日公開予定です