Resend : Transactional 🤝 email 📨 for Developers 🧑‍💻 at scale ⚖️ made easy.

Introduction

The need to create constant communication with your customers or consumer through your product arise with each software built from enterprise softwares down to a newsletter subscription platform. Resend provides the best API to reach humans instead of spam folders. Build, test, and deliver transactional emails at scale. This is a tool that’s largely backed by Y-Combinator.

Resend is the email API for developers

Without haste let’s dive into what more details about Resend and explore it’s useage as it’s supported by various frameworks such as Nextjs, Nodejs as a runtime environment, PHP, Laravel, phyton, expressjs, ruby, rails, Golang, Elixir. Including serverless tools such as: Supabase Edge Functions, Cloudflare Workers, AWS Lambda, Deno Deploy, and Vercel Edge Functions.

1. Getting Started with Nodejs

Prerequisites

To get the most out of this guide, you’ll need to:

• Create an API key.
• Verify your domain
  Steps on how to achieve both guides can be achieved by clicking both options as they would be a clickable link to follow through.

Let’s highlight the steps to get resend in our project working as required.

Install

Get the Resend Node.js SDK.

npm install resend

Send email using HTML

The easiest way to send an email is by using the html parameter.

import { Resend } from 'resend';
const resend = new Resend('re_123456789');

(async function() {
  try {
    const data = await resend.emails.send({
      from: 'onboarding@resend.dev',
      to: 'delivered@resend.dev',
      subject: 'Hello World',
      html: '<strong>It works!</strong>'
    });

    console.log(data);
  } catch (error) {
    console.error(error);
  }
})();

To explain a bit of what’s going on in the above code snippet.

• The Resend module is imported from the 'resend' package.
• An instance of the Resend class is created with the API key 're_123456789'.
• An asynchronous function is defined, which serves as the entry point for sending the email.
• Within the function, the send method of the resend.emails object is called with the necessary parameters for the email, such as the sender, recipient, subject, and HTML content.
• The function awaits the response from the send method and stores it in the data variable.
• If the email is successfully sent, the data is logged to the console.
• If there is an error during the sending process, the error is caught and logged to the console.

Overall, this code demonstrates how to use the Resend library to send an email using the Resend service, with error handling in case any issues occur during the process.

2. Useage with Vercel Edge Functions

Learn how to send your first email using Vercel Edge Functions one of the serverless tools.

Prerequisites

To get the most out of this guide, you’ll need to:

• Create an API key.
• Verify your domain

Make sure you have the latest version of the Vercel CLI installed.

Create a Next.js function

Create a route file under app/api/send/route.ts if you’re using the App Router.

route.ts file

import { NextResponse } from 'next/server';

export const runtime = 'edge';
export const dynamic = 'force-dynamic';

const RESEND_API_KEY = 're_123456789';

export async function POST() {
    const res = await fetch('https://api.resend.com/emails', {
        method: 'POST',
        headers: {
            'Content-Type': 'application/json',
            'Authorization': `Bearer ${RESEND_API_KEY}`
        },
        body: JSON.stringify({
            from: 'onboarding@resend.dev',
            to: 'delivered@resend.dev',
            subject: 'hello world',
            html: '<strong>it works!</strong>',
        })
    });

    if (res.ok) {
        const data = await res.json();
        return NextResponse.json(data);
    }
}

Let’s have a walkthrough of how this code block works. This code snippet demonstrates an API endpoint using Next.js and the Resend service to send an email.

• The NextResponse module is imported from the 'next/server' package.
• Two constants, runtime and dynamic, are declared and assigned specific values.
• The Resend API key is stored in the RESEND_API_KEY constant.
• An asynchronous function named POST is defined, representing the API endpoint for handling HTTP POST requests.
• Inside the function, a fetch request is made to the Resend API endpoint with the necessary headers and payload (including email details).
• If the response from the API (res) is successful (HTTP status 200), the JSON response is parsed (await res.json()) and returned as a JSON response using NextResponse.json(data).
• If there is an error during the API request, the response status will not be ok, and the function will return the default response.

In a nutshell, this code sets up an API endpoint that sends an email using the Resend service when a POST request is received. It handles authentication, constructs the request payload, and returns the response to the client.

Send email locally

Run function locally:

npx next dev

Open the endpoint URL to send an email: http://localhost:3000/api/send

Send email in production

Deploy function to Vercel:

vercel

Open the endpoint URL to send an email: https://your-project.vercel.app/api/send

3. Emails

To improve dev experience Resend provides you the visuals to perform certain functions in the development environment.

View email details

You can see all the metadata associated with an email, including the sender address, recipient address, subject, and more.

Here are all the events that can be associated with an email:

• Sent - The API request was successful and Resend will attempt to deliver the message to the recipient’s mail server.
• Delivered - Resend successfully delivered the email to the recipient’s mail server.
• Delivery Delayed - The email couldn’t be delivered to the recipient’s mail server because a temporary issue occurred. Delivery delays can occur, for example, when the recipient’s inbox is full, or when the receiving email server experiences a transient issue.
• Complained - The email was successfully delivered to the recipient’s mail server, but the recipient marked it as spam.
• Bounced - The recipient’s mail server permanently rejected the email.

Share email link

You can share a public link of an email with anyone. This will help them view the email without needing a Resend account.

There are other functions provided by resend such as webhooks and adding domains of your project to resend.

For reference on it’s useage and detailed explanation of these functions. Check out the documentation link.

4. Conclusion:

In my honest opinion I’m quite satisfied with this tool. With it’s definitive code block that’s easily readable and provision of visuals to easily track operations around the email of functions and operations performed on resend. I would gladly recommend and use it in my next project.

5. Reference:

All references from this article was found in this link below.

https://resend.com/home

Find this article helpful? Drop a like, comment or share to increase audience.

Gracias 🙏.