Kami menggunakan cookies untuk meningkatkan pengalaman Anda di website ini. Dengan melanjutkan, Anda menyetujui penggunaan cookies sesuai Kebijakan Privasi kami.
Email masih jadi channel konversi tertinggi — ROI rata-rata $36 untuk setiap $1 yang dikeluarkan. Resend dan React Email membuat setup email profesional jadi sangat mudah untuk developer.
Muhamad Putra Aulia Hidayat
Email yang Benar-Benar Masuk Inbox
Problem nomor satu email bisnis: masuk spam. Resend adalah email service baru yang dirancang khusus untuk developer, dengan deliverability tinggi dan developer experience yang luar biasa.
npm install resend @react-email/components
// emails/WelcomeEmail.tsx
import {
Body, Button, Container, Head, Heading,
Hr, Html, Img, Link, Preview, Section, Text
} from "@react-email/components"
interface WelcomeEmailProps {
name: string
loginUrl: string
}
export function WelcomeEmail({ name, loginUrl }: WelcomeEmailProps) {
return (
<Html lang="id">
<Head />
<Preview>Selamat datang di Digital Uptime, {name}!</Preview>
<Body style={{ backgroundColor: "#f6f9fc", fontFamily: "Arial, sans-serif" }}>
<Container style={{ maxWidth: "600px", margin: "0 auto", padding: "20px" }}>
<Heading style={{ color: "#1a1a1a", fontSize: "24px" }}>
Halo, {name}!
</Heading>
<Text style={{ color: "#444", lineHeight: "1.6" }}>
Terima kasih sudah bergabung dengan Digital Uptime.
</Text>
<Button href={loginUrl} style={{ backgroundColor: "#2563eb", color: "#ffffff", padding: "12px 24px", borderRadius: "6px" }}>
Masuk ke Dashboard
</Button>
</Container>
</Body>
</Html>
)
}
// app/api/email/welcome/route.ts
import { Resend } from "resend"
import { WelcomeEmail } from "@/emails/WelcomeEmail"
const resend = new Resend(process.env.RESEND_API_KEY)
export async function POST(req: Request) {
const { name, email } = await req.json()
const { data, error } = await resend.emails.send({
from: "Digital Uptime <hello@digiupti.com>",
to: [email],
subject: `Selamat datang, ${name}!`,
react: WelcomeEmail({ name, loginUrl: "https://digiupti.com/dashboard" }),
})
if (error) return Response.json({ error }, { status: 500 })
return Response.json({ id: data?.id })
}
DNS Records yang perlu ditambahkan:
v=spf1 include:amazonses.com ~allv=DMARC1; p=quarantine; rua=mailto:dmarc@yourdomain.comDengan setup SPF, DKIM, dan DMARC yang benar, email akan masuk inbox, bukan folder spam.
npx react-email dev
# Buka http://localhost:3000
# Lihat semua template email dengan live preview
Email marketing yang dilakukan dengan benar bisa jadi sumber revenue terbesar bisnis digital Anda.
Tips teknologi & bisnis mingguan
Bergabung dengan 2,500+ subscriber yang mendapatkan insight teknologi, tutorial development, dan tips bisnis digital langsung ke inbox mereka setiap minggu.
Dapatkan tips & insight teknologi terbaru langsung ke inbox Anda.
© 2026 PT Digital Uptime Teknologi Informasi. Hak cipta dilindungi.