Lewati ke konten
Abihuy
SookeyMail — Premium Temporary Email — cover image

SookeyMail — Premium Temporary Email

Layanan email sementara premium dengan UI dark-violet ala Apple, custom domain, dan notifikasi Telegram real-time.

Tahun
2025
Klien
Klien
SookeyMail
Durasi
2 minggu
  • Next.js 16
  • Cloudflare Workers
  • Email Routing
  • Tailwind
  • shadcn
  • Telegram Bot

TL;DR

Layanan email sementara premium dengan UI dark-violet ala Apple, custom domain, dan notifikasi Telegram real-time.

Brief & problem

Sebagian besar layanan temporary email di luar sana terlihat seperti situs phising dari tahun 2008 — banner iklan judi, popup random, dan UI yang bikin males buka di laptop kantor. SookeyMail mau ambil sudut yang beda: orang rela bayar untuk inbox sementara, asal pengalamannya bersih, cepat, dan terlihat premium.

Masalahnya, bikin "premium" itu bukan cuma soal warna ungu sama animasi halus. Inbox sementara harus bener-bener jalan: email masuk dalam hitungan detik, OTP dari bank/marketplace ke-detect otomatis, custom domain bisa diatur sendiri, dan biaya operasional tetap masuk akal walaupun ada ribuan mailbox aktif barengan.

Plus satu lagi — Boss SookeyMail mau notifikasi langsung ke Telegram tiap email masuk. Bukan webhook generik, tapi pesan rapi yang udah di-format MarkdownV2: subject di-bold, sender italic, OTP di-spoiler kalau ke-detect, dan tombol "Buka Inbox" yang langsung loncat ke web.

Pendekatan

Kita bangun ulang frontend dari nol pakai Next.js 16 dan design system "Royal Violet": background ungu gelap dengan halo gradient, glass surface tipis, tipografi yang lega, dan mikrointeraksi yang halus tapi gak lebay. Referensi visualnya jelas: bikin orang yang biasa pake produk Apple langsung ngerasa "oh, ini mahal, tapi worth it".

Untuk backend, kita gak pake server tradisional. Semua jalan di atas Cloudflare Email Routing + Workers:

  1. Domain custom (5+ domain support, tinggal tambahin via dashboard) di-route ke Worker.
  2. Worker parsing raw email, ekstrak header, body, attachment, dan jalanin OTP detector custom — regex yang udah dilatih buat pola OTP Indonesia (BCA, Shopee, Tokped, Gojek, dll.).
  3. Hasilnya disimpen, lalu dorong ke Telegram bot via API dengan format MarkdownV2 yang udah di-escape rapi.

Detail kecil yang ternyata penting: notifikasi Telegram pake template per-jenis-email. OTP dapet template sendiri dengan kode di-spoiler ||...|| biar gak ke-screenshot duluan. Email biasa dapet ringkasan body 2 baris. Email dari sender yang udah di-whitelist langsung di-pin.

UI-nya dark-first karena premium product hampir selalu enak di dark mode. shadcn dipake buat building block (dialog, sheet, command palette), Tailwind buat layout, dan satu-dua animasi spesial (halo behind logo, gradient text shimmer di hero) ditulis manual biar gak nge-bloat bundle.

Galeri

Tangkapan layar dari project SookeyMail — Premium Temporary Email.

  • SookeyMail — Premium Temporary Email — Inbox view
    Inbox view
  • SookeyMail — Premium Temporary Email — Compose flow
    Compose flow
  • SookeyMail — Premium Temporary Email — Premium plan
    Premium plan
  • SookeyMail — Premium Temporary Email — Mobile view
    Mobile view

Tech stack

Tools yang dipakai bikin project ini.

  • Next.js 16
  • Cloudflare Workers
  • Email Routing
  • Tailwind
  • shadcn
  • Telegram Bot

Cerita lengkap

Tantangan

Sebagian besar layanan temporary email di luar sana terlihat seperti situs phising dari tahun 2008 — banner iklan judi, popup random, dan UI yang bikin males buka di laptop kantor. SookeyMail mau ambil sudut yang beda: orang rela bayar untuk inbox sementara, asal pengalamannya bersih, cepat, dan terlihat premium.

Masalahnya, bikin "premium" itu bukan cuma soal warna ungu sama animasi halus. Inbox sementara harus bener-bener jalan: email masuk dalam hitungan detik, OTP dari bank/marketplace ke-detect otomatis, custom domain bisa diatur sendiri, dan biaya operasional tetap masuk akal walaupun ada ribuan mailbox aktif barengan.

Plus satu lagi — Boss SookeyMail mau notifikasi langsung ke Telegram tiap email masuk. Bukan webhook generik, tapi pesan rapi yang udah di-format MarkdownV2: subject di-bold, sender italic, OTP di-spoiler kalau ke-detect, dan tombol "Buka Inbox" yang langsung loncat ke web.

Solusi

Kita bangun ulang frontend dari nol pakai Next.js 16 dan design system "Royal Violet": background ungu gelap dengan halo gradient, glass surface tipis, tipografi yang lega, dan mikrointeraksi yang halus tapi gak lebay. Referensi visualnya jelas: bikin orang yang biasa pake produk Apple langsung ngerasa "oh, ini mahal, tapi worth it".

Untuk backend, kita gak pake server tradisional. Semua jalan di atas Cloudflare Email Routing + Workers:

  1. Domain custom (5+ domain support, tinggal tambahin via dashboard) di-route ke Worker.
  2. Worker parsing raw email, ekstrak header, body, attachment, dan jalanin OTP detector custom — regex yang udah dilatih buat pola OTP Indonesia (BCA, Shopee, Tokped, Gojek, dll.).
  3. Hasilnya disimpen, lalu dorong ke Telegram bot via API dengan format MarkdownV2 yang udah di-escape rapi.

Detail kecil yang ternyata penting: notifikasi Telegram pake template per-jenis-email. OTP dapet template sendiri dengan kode di-spoiler ||...|| biar gak ke-screenshot duluan. Email biasa dapet ringkasan body 2 baris. Email dari sender yang udah di-whitelist langsung di-pin.

UI-nya dark-first karena premium product hampir selalu enak di dark mode. shadcn dipake buat building block (dialog, sheet, command palette), Tailwind buat layout, dan satu-dua animasi spesial (halo behind logo, gradient text shimmer di hero) ditulis manual biar gak nge-bloat bundle.

Tech

Stack-nya sengaja tipis biar deploy bisa < 60 detik dan biaya bulanan tetap di angka warung kopi:

  • Next.js 16 dengan App Router + Server Components — semua list inbox di-render di server, frontend cuma kirim minimal JS.
  • Cloudflare Workers buat email handler dan API. Latency rata-rata < 200ms global karena di-eksekusi di edge terdekat user.
  • Cloudflare Email Routing sebagai gateway — gratis, scalable, dan support custom domain native.
  • Tailwind v4 + shadcn buat UI. Tema "Royal Violet" custom dengan token warna sendiri (violet-950 base, fuchsia accent, cyan untuk CTA).
  • Telegram Bot API dengan formatter MarkdownV2 custom — escape semua karakter spesial (_*[]()~\>#+-=|.!`) biar gak nge-break di sisi user.

Build pipeline-nya simple: push ke main → GitHub Actions lint+typecheck → Cloudflare Pages auto-deploy. Tanpa Vercel, tanpa server, tanpa drama.

Outcome

Setelah dua minggu development (iya, dua minggu — Boss langsung kasih spec yang jelas dan keputusan cepat), SookeyMail go-live di mail.sookeystore.com dengan hasil yang Boss-nya sendiri bilang "lebih bagus dari yang dibayangin":

  • 5+ custom domain aktif bareng, tinggal tambah via dashboard tanpa restart.
  • Ribuan mailbox stabil di Cloudflare Workers, biaya operasional masih di tier gratis untuk volume saat ini.
  • Lighthouse 98 mobile — UI premium tapi loading-nya tetep ngebut di 4G.
  • Notifikasi Telegram rata-rata sampai < 3 detik dari email diterima, OTP detector akurasinya > 95% untuk top-10 sender Indonesia.
  • Deploy ke production konsisten < 60 detik dari git push, jadi iterasi UI bisa secepat refresh browser.

Yang paling Boss SookeyMail seneng sebenernya bukan angkanya — tapi feedback user pertama yang nulis "ini website temporary email pertama yang gue gak malu pake di laptop kantor". Itu sinyal yang lebih jujur dari Lighthouse score manapun.

"Dua minggu, dari nol sampai live. UI-nya premium, backend-nya tipis, dan Telegram bot-nya jadi favorit gue tiap pagi." — Boss SookeyMail

Catatan kecil: screenshot di galeri masih placeholder — versi real-nya nyusul setelah Boss approve marketing shot final.

Karya lain

Project lain dari Abihuy yang mungkin relevan.

Mau bikin yang serupa?

Kalau project SookeyMail — Premium Temporary Email bikin kamu mikir “ini cocok buat bisnis gue”, ngobrol dulu yuk. Konsultasi gratis lewat WA, biasanya bales < 2 jam di jam kerja.