Letterhearth: a paid newsletter for an independent writer

Letterhearth: a paid newsletter for an independent writer

00 Markdown

Free or $8 a month subscriptions by card, a teaser on paid posts, and markdown posts the writer schedules and emails.

Agent specs

Agent
Claude Code, Opus 5.5 Medium
Time
22 min
Cost
$7.74*

Agents work faster and more accurately on Elements.

* Cost at API rates, September 2026.

Run it yourself

Paste this prompt into your AI agent. You get the finished app on your own machine, ready to change however you like.

Agent Chat
Install elements:
curl -fsSL 'https://install.elements.dev?os=darwin' | sh && export PATH=~/elements/bin:$PATH

Create an Elements app from the elementscode/demo-letterhearth scaffold:
cd ~/elements/projects
elements create letterhearth -scaffold=elementscode/demo-letterhearth
cd letterhearth

Start the app.

Need an AI agent?

In AI desktop apps, paste into the Code tab, not the general chat.

How it's built

Letterhearth needed free and paid subscriptions billed monthly by card, scheduled posts that go out by email, a teaser for readers who are not paying, one-click unsubscribe, and live counts for the writer. Each of those is a part of Elements, so the agent spent its 22 minutes on the newsletter itself.

What Elements gave the app

  • Live counts and revenue. Subscribers are a LiveTable, so the writer's free and paid counts and monthly revenue move the moment a reader subscribes or upgrades.
  • Monthly subscriptions. Subscribing, upgrading and cancelling are @rpc calls, and paid plans go through Stripe at $8 a month. The return page and Stripe's webhook record a new subscription once. Until a Stripe key is added, a built-in test checkout takes the payment through the same code, and in production the app registers its own webhook.
  • Posts on a schedule. A cron schedule checks every minute for posts whose time has come and queues one email job per reader, so a failed send retries alone. Paid posts go in full to paid readers and as a teaser to everyone else.
  • One-click unsubscribe. Every email carries the headers mail clients turn into an unsubscribe button, and the app answers that button directly.
  • Data from SQL files. Migrations define the newsletter and seed the writer, six posts (three paid), five free readers and three on complimentary paid plans.
  • Sessions for readers and the writer. Readers are signed in when they subscribe and later by an emailed link, and every writer page shares one guard on the writer's role.

What the project server gave the agent

The project server runs alongside the agent and answers as soon as a file is saved: it type-checks the templates, TypeScript and SQL, applies migrations and reruns the tests, so every question came back right away and the agent kept building.

What shipped

The app type-checks with zero errors and all 57 tests pass. Every page works on desktop and phone. A real sandbox payment went through Stripe end to end.

The code

Build it from scratch

To watch your agent build this app from an empty project, use the prompt we used instead. It takes longer than starting from the finished app above.

Agent Chat
Install elements:
curl -fsSL 'https://install.elements.dev?os=darwin' | sh && export PATH=~/elements/bin:$PATH

Create an Elements app:
cd ~/elements/projects
elements create letterhearth
cd letterhearth

Start the app, then build this:

Build a paid newsletter site named letterhearth for an independent writer.

READER
- Subscribe with an email address, free or paid ($8/month by credit card).
- Upgrade, or cancel a paid subscription.
- Read the archive. Paid posts show the first paragraphs and a subscribe prompt
  to readers who are not paying.

WRITER (one admin account)
- Write posts in markdown with a live preview. Mark each post free or paid.
- Publish now or schedule for later.
- Publishing emails the post: free posts to every subscriber, paid posts in full
  to paid subscribers and as a teaser with a link to free subscribers.
- Subscriber list with free and paid counts and monthly revenue.

Every email has a one-click unsubscribe link.

Public home page: the newsletter's name, a subscribe form and the post archive.

Payments by Stripe.

Seed the writer, five free and three paid subscribers, and six posts, some paid.
Show the writer's login on the sign-in page.

Subscriber counts and revenue update in real time.

The weekly digest

New lessons, demos and posts from elements.dev, in one email a week.

Comments· 0