Send Emails from Next.js with Hisend SDK

Published: (March 17, 2026 at 06:22 PM EDT)
3 min read
Source: Dev.to

Source: Dev.to

Prerequisites

  • A Next.js project using the App Router
  • Node.js installed
  • A verified domain for sending emails

Set up Hisend

  1. Sign up – Go to hisend.app and create a free account.
  2. Create a project – Set up your first workspace/project.
  3. Add your domain – Enter the domain you want to send emails from (e.g., yourdomain.com).
  4. Configure DNS – Hisend will generate SPF, DKIM, and DMARC records. Add them to your DNS provider (Cloudflare, Vercel, Hetzner, etc.) to verify the domain.
  5. Generate an API key – In project settings, create a new API key and copy it for later use.

Install the Hisend SDK

npm install @hisend/sdk
# or yarn add @hisend/sdk
# or pnpm add @hisend/sdk
# or bun add @hisend/sdk

Configure the API key

Add the key to your .env.local file at the root of the project:

HISEND_API_KEY=your_api_key_here

Create a Route Handler

In the App Router, place third‑party API calls in a route handler to keep secrets server‑side.

Create app/api/send/route.ts (or .js if you’re not using TypeScript):

import { NextResponse } from 'next/server';
import { Hisend } from '@hisend/sdk';

// Initialize the SDK with your API key
const hisend = new Hisend(process.env.HISEND_API_KEY);

export async function POST(request: Request) {
  try {
    const { email, name } = await request.json();

    const data = await hisend.emails.send({
      from: 'Acme Team ', // must match your verified domain
      to: [email],
      subject: `Welcome to the app, ${name}!`,
      html: `
## Hi ${name},

Thanks for signing up. We are thrilled to have you on board.

Cheers,
The Acme Team
      `,
    });

    return NextResponse.json({ success: true, data });
  } catch (error) {
    return NextResponse.json(
      { success: false, error: 'Failed to send email' },
      { status: 500 }
    );
  }
}

Call the API from the client

'use client';

export default function SignupButton() {
  const sendWelcomeEmail = async () => {
    await fetch('/api/send', {
      method: 'POST',
      headers: { 'Content-Type': 'application/json' },
      body: JSON.stringify({
        email: 'user@example.com',
        name: 'Alex',
      }),
    });
    alert('Email sent successfully!');
  };

  return (
    <button onClick={sendWelcomeEmail}>Send Welcome Email</button>
  );
}

Why choose Hisend?

  • GDPR out‑of‑the‑box – Hosted on Hetzner (Nuremberg) and AWS (Frankfurt); data never leaves the EU.
  • Simplified email retrieval – One request returns body, sender name, and attachments.
  • Native threading – Manage email conversations directly via the API.
  • Auto‑forwarding – Built‑in support without extra workarounds.

Explore the full documentation and start sending emails at hisend.app.

Happy coding! 🚀

0 views
Back to Blog

Related posts

Read more »