Setting Up Mailchimp 📧

This guide will help you set up Mailchimp for sending HTML emails in your application.

Prerequisites 📋

A Mailchimp account
Access to your domain's DNS settings
Domain verified in Mailchimp
API key with send permissions

Domain Verification 🔍

Go to Mailchimp Dashboard
Navigate to Account > Domains
Add and verify your domain
Add the provided DNS records to your domain settings

Implementation 💻

Install required dependencies:

pnpm add @mailchimp/mailchimp_transactional

Create src/lib/email/sendMail.ts:

import mailchimp from "@mailchimp/mailchimp_transactional";
import { appConfig } from "../config";

const sendMail = async (to: string, subject: string, html: string) => {
  if (process.env.NODE_ENV !== "production") {
    console.log(
      "Sending email to",
      to,
      "with subject",
      subject,
      "and html",
      html
    );
    return;
  }

  const client = mailchimp(process.env.MAILCHIMP_API_KEY);

  const message = {
    html: html,
    subject: subject,
    from_email: appConfig.email.senderEmail,
    from_name: appConfig.email.senderName,
    to: [
      {
        email: to,
        type: "to"
      }
    ],
    headers: {
      "Reply-To": appConfig.email.senderEmail
    }
  };

  const response = await client.messages.send({ message });
  console.log("Email sent successfully", response);
};

export default sendMail;

Environment Variables 🔐

Add these to your .env.local:

MAILCHIMP_API_KEY=your_api_key

Testing Email Setup 🧪

Send a test email using Mailchimp dashboard
Monitor delivery in Mailchimp Activity Feed
Check email headers for proper authentication

Important Notes ⚠️

DNS propagation takes time (24-48 hours)
Monitor email reputation in Mailchimp dashboard
Keep bounce rate below recommended threshold
Use production API key in production
Only HTML emails are supported

Remember to wait for DNS propagation before testing your email setup. Rushing this process can lead to delivery issues! 🚀

Mailchimp Setup