How to Use Notify with TypeScript/JavaScript

Send your first email with Notify using pure TypeScript/JavaScript, no dependencies needed.

Before we begin, know that we don't recommend this approach. The Notify Node.js SDK does a lot more under the hood, and handles a lot of the heavy lifting for you.

But if you're not using Node at all, or can't because of organizational limitations—goodness knows we've all been there—this is a decent workaround, if a little verbose.

Prerequisites

Before you start, make sure you have:

  • Your API key – We generated one for you when you signed up. This authenticates your app and lets you send emails.
  • A verified domain (optional) – Not required for testing. Trial accounts can send up to 100 emails total (10/hr limit). To scale beyond that, verify your domain for better deliverability.

1. Create the Notify Class

We’ll create a simple Notify class to wrap API calls. This mimics the functionality of the Notify SDK but works in pure TypeScript/JavaScript with fetch.

interface SendEmailParams {
  subject: string;
  to: string;
  name: string;
  message: string;
}

interface SendEmailFromTemplateParams {
  templateId: string;
  from?: string;
  to: string;
  variables?: Record<string, string>;
}

class Notify {
  private readonly apiKey: string;
  private readonly apiUrl: string;

  constructor(apiKey: string, apiUrl = "https://notify.cx/api") {
    if (!apiKey) {
      throw new Error("API key is required");
    }
    this.apiKey = apiKey;
    this.apiUrl = apiUrl;
  }

  async sendEmail(params: SendEmailParams): Promise<void> {
    const response = await fetch(`${this.apiUrl}/send-email`, {
      method: "POST",
      headers: {
        "Content-Type": "application/json",
        "x-api-key": this.apiKey,
      },
      body: JSON.stringify(params),
    });

    if (!response.ok) {
      throw new Error(`Failed to send email: ${response.statusText}`);
    }
    console.log("Email sent successfully:", await response.json());
  }

  async sendEmailFromTemplate(params: SendEmailFromTemplateParams): Promise<void> {
    const response = await fetch(`${this.apiUrl}/send-email-from-template`, {
      method: "POST",
      headers: {
        "Content-Type": "application/json",
        "x-api-key": this.apiKey,
      },
      body: JSON.stringify(params),
    });

    if (!response.ok) {
      throw new Error(`Failed to send email from template: ${response.statusText}`);
    }
    console.log("Email from template sent successfully:", await response.json());
  }
}

2. Send an Email

Now that we have the Notify class, let's send a basic email:

const notify = new Notify("YOUR_NOTIFY_API_KEY");

async function sendEmail() {
  try {
    await notify.sendEmail({
      to: "recipient@example.com",
      subject: "Hello world",
      name: "John Doe",
      message: "Your email content here", // Plain text or HTML
    });
  } catch (error) {
    console.error("Failed to send email:", error);
  }
}

sendEmail();

Run this in a browser console or any JS/TS environment that supports fetch.

3. Sending Template-Based Emails

Instead of writing HTML manually for the message field, use Notify's templates. Notify offers an intuitive template builder with pre-made and fully customizable templates. These support dynamic variables for personalization.

async function sendTemplatedEmail() {
  try {
    await notify.sendEmailFromTemplate({
      to: "recipient@example.com",
      from: "noreply@notify.cx",
      templateId: "<your_template_id>",
      variables: {
        name: "John Doe",
        company: "Example Inc.",
      },
    });
  } catch (error) {
    console.error("Failed to send email from template:", error);
  }
}

sendTemplatedEmail();

Both sendEmail and sendEmailFromTemplate throw errors if the request fails. Always wrap them in try/catch.

Where To Next?

Now you’re ready to send emails with Notify using pure TypeScript/JavaScript! 🚀