Email Setup

This document provides an overview of setting up email services using SendGrid and Mailgun in your project. We'll cover the necessary environment variables, the functionality provided by the project, and a guide for end users to configure their accounts and obtain API keys.

SendGrid

SendGrid Setup

To send emails using SendGrid, follow these steps:

Setup

1. Create a SendGrid Account:

   • Go to SendGrid and sign up for an account.

2. Obtain API Key:

   • After signing up, navigate to the API Keys section in your SendGrid dashboard.
   • Create a new API key and make sure to copy it. You'll need it for the environment variables.

3. Add your API key to .env.local:

   • Rename .env.example to .env.local if you haven't already.
   • Add your SendGrid API key to SENDGRID_API_KEY in .env.local.
   • Add the sender email to SENDGRID_FROM_EMAIL in .env.local.

Sending Emails

To send an email, you need to call the SendGrid endpoint in your project. Ensure that the environment variables are properly configured.

Tip: Always validate email addresses and content before sending to avoid errors and ensure deliverability.

Example of Calling the SendGrid Endpoint

const sendEmail = async () => {
  try {
    const response = await fetch('/api/sendgrid', {
      method: 'POST',
      body: JSON.stringify({
        to: 'recipient@example.com',
        subject: 'Test Email',
        text: 'This is a test email sent from the frontend.',
      }),
    });
    const data = await response.json();
    if (response.ok) {
      console.log('Email sent successfully:', data);
    } else {
      console.error('Error sending email:', data);
    }
  } catch (error) {
    console.error('Error:', error);
  }
};

Mailgun

Mailgun Setup

This document provides an overview of setting up email services using Mailgun in your project. We'll cover the necessary environment variables, the functionality provided by the project, and a guide for end users to configure their accounts and obtain API keys.

Mailgun Setup

To send emails using Mailgun, follow these steps:

Setup

1. Create a Mailgun Account:

   • Go to Mailgun and sign up for an account.

2. Obtain API Key and Domain:

   • After signing up, navigate to the API Keys section in your Mailgun dashboard.
   • Copy your API key and domain. You'll need them for the environment variables.

3. Add your API key and domain to .env.local:

   • Rename .env.example to .env.local if you haven't already.
   • Add your Mailgun API key and domain to MAILGUN_API_KEY and MAILGUN_DOMAIN in .env.local.
   • Add sender email to MAILGUN_FROM_EMAIL in .env.local.

Sending Emails

To send an email, you need to call the Mailgun endpoint in your project. Ensure that the environment variables are properly configured.

Tip: Always validate email addresses and content before sending to avoid errors and ensure deliverability.

Example of Calling the Mailgun Endpoint

const sendEmail = async () => {
  try {
    const response = await fetch('/api/mailgun', {
      method: 'POST',
      body: JSON.stringify({
        to: 'recipient@example.com',
        subject: 'Test Email',
        text: 'This is a test email sent from the frontend.',
      }),
    });
    const data = await response.json();
    if (response.ok) {
      console.log('Email sent successfully:', data);
    } else {
      console.error('Error sending email:', data);
    }
  } catch (error) {
    console.error('Error:', error);
  }
};