Every week, a church administrator spent up to two hours manually assembling the congregation's email bulletin by copy-pasting content from various sources into an email client, fixing formatting, and checking for errors before sending. Mistakes regularly slipped through, and the process was stressful and error-prone.
A purpose-built Vue 3 web app with eight typed content blocks (Prayer, Date, Activity, Event, Notice, Pastoral, Link, Download), a drag-and-drop reorder editor, and a 464-line HTML serialiser (generateHTML.js) that converts block data into inbox-safe table-based HTML. One button calls the Brevo Campaigns API directly from the browser, no backend server required. Supabase logs every send to a send_log table.
The weekly bulletin now takes under ten minutes to prepare and send. The administrator reports zero formatting errors since launch, and the congregation receives a consistently formatted email every week.
$ list features
# 5 features found
PrayerBlock, DateBlock, ActivityBlock, EventBlock, NoticeBlock, PastoralBlock, LinkBlock, and DownloadBlock, each with its own input form, icon, and serialisation logic. TAG_STYLES maps 7 tag types to inline colour styles; PASTORAL_LABELS provides 6 emoji-prefixed pastoral role labels.
generateHTML.js converts the block array to inbox-safe table-based HTML with inline styles. Each block type has its own render function; the serialiser handles conditional sections, list formatting, and the pastoral emoji prefixes automatically.
The send button calls the Brevo Campaigns API directly from the Vue app with the API key in the request header. No Node.js server or serverless function, the browser is the client. Practical for an internal tool with a single administrator.
Every successful send writes a record to the send_log table in Supabase, timestamp, recipient count, and bulletin subject. Gives the administrator a permanent audit trail without a custom backend.
A side panel re-renders the bulletin HTML in real time as blocks are edited or reordered. Staff catch layout issues before sending, no test-email round trips.
$ npm list --depth=0
$ git log --oneline
$ debug --issues
LET'S BUILD SOMETHING TOGETHER
I'm always open to discussing new projects, partnerships, or just a good idea.