DEV Community

Cover image for From idea to paying customers: building an AI changelog tool with Angular 21
Harry
Harry

Posted on

From idea to paying customers: building an AI changelog tool with Angular 21

#angular #typescript #ai #buildinpublic

How I built Releasely with Angular 21, Supabase, and Claude API

I just launched Releasely — an AI changelog generator for indie SaaS founders. From first commit to deployed product while working part-time around my day job.

Here's the full stack and what I learned.

The Idea

Every time I shipped a release, I wrote the same changelog three times — once for my team in technical language, once for users in plain English, once for X in punchy marketing tone. It killed my release-day momentum.

Generic AI tools give you one output. I wanted three audience-specific versions from one input.

The Stack

Frontend — Angular 21

  • Standalone components only (no NgModules)
  • Zoneless change detection (no zone.js)
  • Signal inputs/outputs throughout
  • @if / @for new control flow
  • inject(), toSignal(), computed() patterns
  • Deployed on Vercel

Backend — Node.js + Express

  • Deployed on Railway (always-on, no cold starts)
  • Express middleware for auth, rate limiting, sanitization
  • All Claude API calls server-side only

Database + Auth — Supabase

  • RLS enabled on every table
  • Magic link auth with branded emails via Resend SMTP
  • Auto-profile trigger on user signup
  • 6 tables: profiles, changelogs, usage_logs, subscribers, github_connections, github_repos

AI — Claude Sonnet 4.6

  • Three different system prompts (one per tone)
  • User input wrapped in XML tags for prompt injection defence
  • Prompt caching for repeated context

Payments — Lemon Squeezy

  • Stripe is invite-only in India, Lemon Squeezy was the cleanest alternative
  • Merchant of record handles global tax automatically
  • Webhook-based plan upgrades to Supabase profiles

GitHub App Integration

  • @octokit/app for installation tokens
  • AES-256-GCM encryption for stored tokens
  • CSRF state parameter on OAuth flow
  • Webhook signature verification

Architecture Decisions That Mattered

1. Backend-only API keys

The Claude API key never touches the Angular bundle. Angular calls /api/generate on my Node backend, which checks auth, enforces quota, then calls Claude. This is non-negotiable for any AI SaaS.

2. Two-layer rate limiting

  • IP-level: express-rate-limit, 20 req/min
  • Per-user: daily quota checked against Supabase usage_logs (5/100/300 for free/solo/team)

3. XML-wrapped user input

Every user input is wrapped in <commits>...</commits> tags before being sent to Claude. The system prompt explicitly says to treat content inside those tags as data only, never as instructions. Simple but effective prompt injection defence.

4. Supabase RLS on everything

Row Level Security enforced at database level — users can only ever read their own rows. If my application code has a bug, the database still protects user data.

What Took Longer Than Expected

  • GitHub App vs OAuth App: Spent half a day figuring out which one to use. (Answer: GitHub App for finer permissions and webhooks.)
  • Email deliverability: Magic links going to spam initially. Fixed by setting up custom SMTP through Resend with proper SPF/DKIM.
  • Wildcard DNS for subdomains: Hosted public changelog pages at {user}.releasely.io required wildcard DNS config on Vercel.

What Was Faster Than Expected

  • Supabase auth flow: Magic link working in 30 minutes
  • Lemon Squeezy webhooks: 2 hours from signup to live payments
  • Claude prompt tuning: 3 tones working well after maybe 5 iterations
  • Railway deployment: Push to git, it deploys. No configuration.

Lessons for Indie SaaS Builders

  1. Research competitors thoroughly before naming your product. I named mine "ChangelogAI" only to find changelogai.dev existed. Had to rebrand mid-build to Releasely.

  2. AI in the middle, integrations as the moat. Anyone can wrap Claude in a chat interface. Real defensibility comes from GitHub OAuth, Slack bots, Jira sync — places ChatGPT can't go.

  3. Ship before perfecting. I have things I want to improve. Doesn't matter. Live and getting feedback beats polished and shelved every single time.

  4. The studio model compounds. Releasely is product #3 in my Devcraft studio (UI kit + dashboard kit being the others). Each product makes the next easier to launch.

Try It

Releasely — free for 5 changelogs/month, $9/mo for unlimited.

Honest feedback welcome. If you ship code and hate writing release notes, this is for you.

Top comments (0)