H
Hono•7d ago
rszab003

How can I use hono/jsx templates to send Emails via Nodemailer?

I'm not sure if this is possible currently... I would like to render a JSX or TSX component without having to set up a route. I want to render a JSX component to an html string with one function call, so I can pass the string to nodemailer. How can I achieve this with hono?
5 Replies
ambergristle
ambergristle•7d ago
https://hono.dev/docs/helpers/html
html Helper - Hono
Web framework built on Web Standards for Cloudflare Workers, Fastly Compute, Deno, Bun, Vercel, Node.js, and others. Fast, but not only fast.
ambergristle
ambergristle•7d ago
this will work for simple html
rszab003
rszab003OP•6d ago
thanks for your response @ambergristle ... is it possible to template an email with this helper?
ambergristle
ambergristle•6d ago
i don't see why not 
const EmailTemplate = (content: string) => (
  <div>
    {content}
  </div>
);

const htmlString = raw(<EmailTemplate />)
const EmailTemplate = (content: string) => (
  <div>
    {content}
  </div>
);

const htmlString = raw(<EmailTemplate />)
rszab003
rszab003OP•5d ago
I didn't know the raw function could do that. This is generally how I got templated emails working with hono: 
import nodemailer from "nodemailer";
import type {Transporter, SentMessageInfo} from "nodemailer";
import Email from "./Email";
import { raw } from "hono/html";

async function main() {
  const recipientName: string = "name";
  const email: string = raw(<Email name={recipientName}/>).toString(); // nodemailer expects plain string
  console.log(email);

  const transporter: Transporter = nodemailer.createTransport({
    host: 'smtp.yourhost.ch',
    port: 465,
    secure: true, // 465 or 587
    auth: {
      pass: '...'
    },
  });

  const info: SentMessageInfo = await transporter.sendMail({
    from: '"name :ghost:" <[email protected]>', // sender address
    to: '[email protected]', // list of receivers
    subject: `HELLO!? ${recipientName}`, // Subject line
    html: email
  });
}

main().catch(console.error);
import nodemailer from "nodemailer";
import type {Transporter, SentMessageInfo} from "nodemailer";
import Email from "./Email";
import { raw } from "hono/html";

async function main() {
  const recipientName: string = "name";
  const email: string = raw(<Email name={recipientName}/>).toString(); // nodemailer expects plain string
  console.log(email);

  const transporter: Transporter = nodemailer.createTransport({
    host: 'smtp.yourhost.ch',
    port: 465,
    secure: true, // 465 or 587
    auth: {
      pass: '...'
    },
  });

  const info: SentMessageInfo = await transporter.sendMail({
    from: '"name :ghost:" <[email protected]>', // sender address
    to: '[email protected]', // list of receivers
    subject: `HELLO!? ${recipientName}`, // Subject line
    html: email
  });
}

main().catch(console.error);

Did you find this page helpful?