Resendが『メール配信のVercel』として急成長
ResendはVercel/Next.js界隈で急速に普及しているモダンなメール配信プラットフォームで、React Email(React コンポーネントとしてメールテンプレートを書く仕組み)と組み合わせることで、開発者体験を圧倒的に改善しました。SendGrid・AWS SES・Mailgunの3大手と比べて、TypeScript First・Webhook統合・モニタリングUIが洗練されている点が特徴。AI/SaaSスタートアップでの採用が急増しています。
Resend採用を検討すべき5つのシグナル
- SendGrid/AWS SESの設定が複雑でメンテが負担になっている
- HTMLメールテンプレートのメンテが大変(テーブルレイアウト・インラインCSS地獄)
- React/Next.jsプロジェクトのスタックに合わせてシンプルに統合したい
- 到達率・開封率の可視化UIを使いたい
- Webhook処理(バウンス・スパム通報)を自動化したい
SendGrid/AWS SES/Resend比較
SendGrid: 業界最大手・大規模配信実績豊富。料金やや高め・UIは少し古い。
AWS SES: 安価・AWS統合強い。設定・運用は本格的に必要。
Mailgun: 開発者向け歴史長い・API成熟。価格中位。
Resend: TS First・React Email統合・モダンUI・Webhook充実。エンタープライズ実績はまだ少なめ。
React Emailの威力
React Emailは『メールテンプレートをReactコンポーネントとして書ける』ライブラリで、Resend公式が開発をスポンサー。Tailwind CSS的なスタイル記述、コンポーネント再利用、TypeScript型安全、PreviewでブラウザでHTMLレンダリング確認などが可能。古いメールクライアント(Outlook 2010等)対応もライブラリが吸収します。
Resend実装の基本パターン
(1) API Key取得: ResendダッシュボードでAPI Key発行
(2) 送信: const resend = new Resend(apiKey); await resend.emails.send({ from, to, subject, react: <Welcome /> })
(3) テンプレート: React Emailで<Html><Body><Text>Hello</Text></Body></Html>
(4) Webhook: バウンス・スパム通報・配信完了をWebhookで通知受信
(5) ドメイン認証: SPF・DKIM・DMARC設定をダッシュボード経由でガイド付き設定
料金感(実務目安)
- Free: 月3,000通・1日100通制限
- Pro: $20/月で50,000通・$0.80/1000通追加
- Enterprise: 個別契約。月100万通以上の規模で要相談
本番運用の3つのチェックポイント
- SPF/DKIM/DMARC: ドメイン認証は3つ全て設定。Google/Yahooの2024年新ルール対応必須
- List-Unsubscribe Header: ワンクリック解除リンクをヘッダに含めないと配信制限される
- Suppression List: バウンス・退会リストの管理。再送付防止
30日学習プラン
- 1週目: Resendアカウント作成・ドメイン認証・テスト配信
- 2週目: React Emailでウェルカム・パスワードリセット・通知テンプレを実装
- 3週目: Webhook処理・配信ステータスのSlack通知統合
- 4週目: 本番フロー連携・Inngest等のジョブキューとの組み合わせ・モニタリング設定
関連リンク
SaaS基盤全般は SaaSスタック選び方、バックグラウンドジョブとの統合は Inngest深掘り、Next.jsとの組み合わせは Next.js深掘り を参照してください。フリーランス独立は フリーランスエンジニアの心構え もどうぞ。