Zindua for React Email

Nodemailer, SendGrid, SES: keep your provider. Host multilingual templates, interpolate {{vars}}, and send with @zindua/sdk v1.4.1. Guide v1.0.0.

npmnpm install @zindua/sdk@1.4.1 @zindua/react-email react-email

npm 1.4.1 React Email docs API docs

Keep your provider

Connect the same SendGrid, SES, SMTP, or Gmail account under Service. Zindua orchestrates; it does not become your ESP.

Import React Email HTML

render() locally, then push bodyHtml with the CLI or SDK. TipTap stays the dashboard editor; no .tsx on our servers.

One send API

Replace transporter.sendMail({ html }) with zindua.send({ template, variables, lang }). Same slug for WhatsApp OTP.

i18n + ops built-in

Locales, {{var|fallback}}, verify-before-send, logs, and failover without rebuilding them around Nodemailer.

@zindua/react-email

pushReactEmail() renders your component and upserts a hosted template version in one call.

CLI companion

zindua templates push and doctor before you swap sendMail in production.

Install, push, send

Pick a step. The TypeScript snippet updates. React Email to first hosted send.

Install SDK

CLI

Add @zindua/sdk and @zindua/react-email. Set your API key in .env.

terminal

TypeScript

1npm install @zindua/sdk@1.4.1 @zindua/react-email react-email2 3# .env4ZINDUA_API_KEY=znd_test_your_key_here

Step by step

From Service connect to zindua.send.

Connect Service, install packages, push HTML, swap sendMail.

Step 0101

Connect Service

Dashboard → Project → Service. Link SendGrid, Amazon SES, custom SMTP, Gmail, or Outlook: the same stack you already use with React Email.

API reference

Methods and environment variables.

Template upsert + render on top of the standard send API.

POST /send

send()

Queue email or WhatsApp message

An API path for any provider

Nodemailer, SendGrid, or SES. Toggle Before / After to see the swap to zindua.send.

Nodemailer

Connect the same SMTP host under Service, then drop the local transporter.

before-nodemailer.tsx

1import { render } from "react-email";2import nodemailer from "nodemailer";3import { WelcomeEmail } from "./emails/welcome";4 5const transporter = nodemailer.createTransport({6  host: "smtp.example.com",7  port: 465,8  secure: true,9  auth: { user: process.env.SMTP_USER, pass: process.env.SMTP_PASS },10});11 12const html = await render(13  <WelcomeEmail name="Ada" appName="Acme" />14);15 16await transporter.sendMail({17  from: "you@example.com",18  to: "user@gmail.com",19  subject: "Welcome",20  html,21});

Push HTML without the helper

Export from React Email, then templates push.

terminal

# After react-email render / export to ./welcome.html
npx @zindua/cli@1.2.0 templates push \
  --slug welcome \
  --lang en \
  --subject "Welcome {{name}}" \
  --html ./welcome.html \
  --default

Test first with the CLI

Smoke test your API key before swapping sendMail in production.

terminal

npx @zindua/cli@latest doctor

Ship the migration

Connect Service, push one template, replace sendMail with zindua.send.

Open dashboard Node.js SDK

1import { render } from "react-email";2import nodemailer from "nodemailer";3import { WelcomeEmail } from "./emails/welcome";4 5const transporter = nodemailer.createTransport({6 host: "smtp.example.com",7 port: 465,8 secure: true,9 auth: { user: process.env.SMTP_USER, pass: process.env.SMTP_PASS },10});11 12const html = await render(13 <WelcomeEmail name="Ada" appName="Acme" />14);15 16await transporter.sendMail({17 from: "you@example.com",18 to: "user@gmail.com",19 subject: "Welcome",20 html,21});