✦ AI Buttons

Free · 6 lessons · TypeScript · A real web app

AI features that feel like
normal buttons.

Tidy up a reply. Fill a form from an email. Route a ticket. Spot this week's themes. Draft a reply that passes your written rules. Five small AI features in a working support desk, each built as a workflow you can read, test and trust.

npm run lesson5
email  my order TS-48213 arrived today and the big mug is cracked…

── first draft ─────────────────────────────
writer We'll send you a new one today, and we'll also refund the
       mug within 24 hours so you're not out of pocket.
✗ R1 "refund the mug within 24 hours" → replacement or refund, not both
✗ R2 "We'll send you a new one today" → don't promise a dispatch day
✗ R3 no photo requested → ask for a photo of the crack
── one targeted revision ─────────────────────────────
writer Could you send us a photo of the crack? As soon as we have it,
       we'll send you a new mug free of charge…
✓ checker: no problems

Ready for a person to read, edit and send. Nothing has been sent.

A real app, not snippets

A small support desk with an inbox, a reply box and a weekly report. Run it with npm start and click the buttons.

No API key to start

Replay mode uses pre-written answers for the sample emails. Add a key to run every button live against Claude.

Built to be trusted

Schemas, checks in plain code, "unknown" as an answer, a person in charge, fallbacks, and a small eval suite.

The lessons

Run it in a minute

git clone https://github.com/georgehanu/ai-buttons.git
cd ai-buttons
npm install
npm start

Node.js 20 or newer. Then open http://localhost:3000.

Hi, I'm George.

I'm a senior web developer. I teach developers to build software with AI, from useful scripts to app features. Small examples, explained clearly. This is the companion to The Agent Loop. If it helped, the best thanks is a follow, and tell me which button you built.

Follow @georgehanu on X