Cara Implement SendGrid Email dengan Claude Code

SendGridメールpengiriman dengan Claude Code: efisienにimplementasi

SendGrid Twilio penyediaan クラウドメールdistribusiservice.高い到達率 dan スケーラブルなdistribusifondasi 備え、トランザクションメール dari マーケティングメールま 幅広くdukungan.Claude Code pemanfaatan 、メールpengiriman機能 efisien pembangunanし.

dasar的なメールpengiriman

> SendGrid dengan メールpengirimanするserviceclass buatkan.
> templatedukungan dan errorハンドリング juga 含めて。

// src/services/email.ts
import sgMail from '@sendgrid/mail';

sgMail.setApiKey(process.env.SENDGRID_API_KEY!);

interface EmailOptions {
  to: string | string[];
  subject: string;
  text?: string;
  html?: string;
  templateId?: string;
  dynamicData?: Record<string, unknown>;
}

export class EmailService {
  private from = {
    email: '[email protected]',
    name: 'MyApp',
  };

  async send(options: EmailOptions): Promise<void> {
    const msg: sgMail.MailDataRequired = {
      to: options.to,
      from: this.from,
      subject: options.subject,
    };

    if (options.templateId) {
      msg.templateId = options.templateId;
      msg.dynamicTemplateData = options.dynamicData;
    } else {
      msg.text = options.text || '';
      msg.html = options.html || '';
    }

    try {
      await sgMail.send(msg);
      console.log(`Email sent to ${options.to}`);
    } catch (error: any) {
      if (error.response) {
        console.error('SendGrid error:', error.response.body);
      }
      throw new Error(`Failed to send email: ${error.message}`);
    }
  }

  async sendBulk(
    recipients: { email: string; data: Record<string, unknown> }[],
    templateId: string
  ): Promise<void> {
    const messages = recipients.map((r) => ({
      to: r.email,
      from: this.from,
      templateId,
      dynamicTemplateData: r.data,
    }));

    // SendGrid 1request 1000通ま
    const chunks = this.chunk(messages, 1000);
    for (const chunk of chunks) {
      await sgMail.send(chunk);
    }
  }

  private chunk<T>(array: T[], size: number): T[][] {
    const chunks: T[][] = [];
    for (let i = 0; i < array.length; i += size) {
      chunks.push(array.slice(i, i + size));
    }
    return chunks;
  }
}

pemanfaatan ダイナミックtemplate

> ウェルカムメール dan パスワードリセットメール 
> template 使ったpengirimanpemrosesan implementasikan.

// src/services/transactional-emails.ts
import { EmailService } from './email';

const emailService = new EmailService();

// templateID konstantamanajemen
const TEMPLATES = {
  WELCOME: 'd-xxxxxxxxxxxxxxxxxxxx',
  PASSWORD_RESET: 'd-yyyyyyyyyyyyyyyyyyyy',
  ORDER_CONFIRMATION: 'd-zzzzzzzzzzzzzzzzzzzz',
} as const;

export async function sendWelcomeEmail(
  email: string,
  name: string
) {
  await emailService.send({
    to: email,
    subject: 'ようこそ！',
    templateId: TEMPLATES.WELCOME,
    dynamicData: {
      name,
      loginUrl: `${process.env.APP_URL}/login`,
      supportEmail: '[email protected]',
    },
  });
}

export async function sendPasswordResetEmail(
  email: string,
  resetToken: string
) {
  const resetUrl = `${process.env.APP_URL}/reset-password?token=${resetToken}`;

  await emailService.send({
    to: email,
    subject: 'パスワードリセット ご案内',
    templateId: TEMPLATES.PASSWORD_RESET,
    dynamicData: {
      resetUrl,
      expiresIn: '24時間',
    },
  });
}

export async function sendOrderConfirmation(
  email: string,
  order: { id: string; items: any[]; total: number }
) {
  await emailService.send({
    to: email,
    subject: `ご注文konfirmasi #${order.id}`,
    templateId: TEMPLATES.ORDER_CONFIRMATION,
    dynamicData: {
      orderId: order.id,
      items: order.items,
      total: order.total.toLocaleString('en-US'),
    },
  });
}

Webhook でeventpemrosesan

> SendGrid Event Webhook pemrosesanして、
> バウンスやスパム報告 記録するendpoint buatkan.

// src/api/sendgrid-webhook.ts
interface SendGridEvent {
  email: string;
  event: string;
  timestamp: number;
  reason?: string;
  sg_message_id?: string;
}

export async function handleSendGridWebhook(events: SendGridEvent[]) {
  for (const event of events) {
    switch (event.event) {
      case 'bounce':
        await handleBounce(event.email, event.reason || '');
        break;
      case 'spamreport':
        await handleSpamReport(event.email);
        break;
      case 'unsubscribe':
        await handleUnsubscribe(event.email);
        break;
      case 'delivered':
        await logDelivery(event.email, event.sg_message_id || '');
        break;
    }
  }
}

async function handleBounce(email: string, reason: string) {
  // バウンスアドレス pengiriman停止リスト penambahan
  console.log(`Bounce: ${email} - ${reason}`);
}

async function handleSpamReport(email: string) {
  // スパム報告 あったアドレス 除外
  console.log(`Spam report: ${email}`);
}

async function handleUnsubscribe(email: string) {
  // distribusi停止pemrosesan
  console.log(`Unsubscribed: ${email}`);
}

async function logDelivery(email: string, messageId: string) {
  console.log(`Delivered to ${email}: ${messageId}`);
}

Summary

SendGrid dan Claude Code pemanfaatanすれば、トランザクションメール dari バルクdistribusiま efisien implementasi bisa dilakukan.メールotomatisasipanduanやWebhookimplementasi juga 合わせて参考 .

Untuk SendGridの詳細, lihat SendGrid公式ドキュメント.