SendinBlue

Subscribe a user to a newsletter

Client Side

const subscribe = async (e: any) => {
  e.preventDefault();
  const email = inputEl?.current?.value;
  const res = await fetch(`/api/subscribe?email=${email}`, {
    method: 'POST',
  });
};

Server Side

export default async function handler(
  req: NextApiRequest,
  res: NextApiResponse<Data>
) {
  try {
    const { email } = inputSchema.parse({ email: req.query.email });
    let sendSmtpEmail = {
      email,
      includeListIds: [2],
      templateId: 5,
      redirectionUrl: process.env.NEXTAUTH_URL + '/newsletter/confirmation',
    };
    const error = await sendinblueDOIContact(sendSmtpEmail);
    if (error) {
      return res.status(500).json({ success: false, error });
    }
    res.status(200).json({ success: true });
  } catch (error: any) {
    return res.status(500).json({ success: false, error });
  }
}

import SibApiV3Sdk from 'sib-api-v3-sdk';

const defaultClient = SibApiV3Sdk.ApiClient.instance;
const apiKey = defaultClient.authentications['api-key'];
apiKey.apiKey = process.env.SENDINBLUE_API_TOKEN;
let apiInstance = new SibApiV3Sdk.ContactsApi();

export const sendinblueDOIContact = async (sendSmtpEmailParams: any) => {
  let createDoiContact = new SibApiV3Sdk.CreateDoiContact(); // CreateDoiContact | Values to create the Double opt-in (DOI) contact

  createDoiContact.email = sendSmtpEmailParams.email;
  createDoiContact.includeListIds = sendSmtpEmailParams.includeListIds;
  createDoiContact.templateId = sendSmtpEmailParams.templateId;
  createDoiContact.redirectionUrl = sendSmtpEmailParams.redirectionUrl;

  const error = await apiInstance.createDoiContact(createDoiContact).then(
    function () {
      return '';
    },
    function (error: any) {
      return error;
    }
  );

  return error;
};

Usage

You can create an account here.

You can create a list of contact here.

You can create a doi template here (double opt-in confirmation template), it will be used for the confirmation email. Don't forget to add the tag optin during the creation and to put {{ doubleoptin }} in the link in the button.

Fetch your api when the user fill the form which will send your doi template.

When your user will click on the confirmation link in the mail, a new contact will automatically be added in your SendinBlue list.

Create an automation in SendinBlue to send your last newsletter email after the contact is added to the list.