A demo app built with Elements.
Short links with custom back-halves and expiry dates, instant redirects, live click counts, referrer, country and device breakdowns, tags, search and QR codes.
Demo: Shortwick
- Agent: Claude Code, Opus 5.5 Medium
- Time: 18 min
- Cost: $5.13 at API rates, September 2026
elements create shortwick -scaffold=elementscode/demo-shortwickShortwick needed short links that redirect at once, a click count that climbs while the owner watches, breakdowns by referrer, country and device, QR codes and accounts. Each of those is a part of Elements, so the agent spent its 18 minutes on the shortener itself.
-
Live click counts. Links are a LiveTable, one view per owner, and a trigger publishes each new count, so the dashboard's numbers climb as visitors click.
-
Links edited straight through the view. The dashboard creates, edits, switches off and deletes links through the live view itself. The table checks the owner, validates the url and back-half, and reports a taken back-half on the form.
-
Redirects first, counting after. A short link sends the visitor on their way, then stores the click and bumps the count in one transaction. Expired and switched-off links get their own page.
-
Analytics that update as clicks arrive. Each click also goes out on a channel, and a link's analytics page adds it to the chart and the referrer, country and device lists over 7, 30 or 90 days.
-
QR codes. Each link has a QR code served as a PNG, built with an npm package.
-
Data and sessions from SQL. Migrations define the shortener and seed two users, twenty links and three months of clicks, and each owner signs in with a session.
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.
The app type-checks with zero errors and all 32 tests pass. Every page works on desktop and phone.
The seed creates twenty links across two accounts with three months of click
history (about 2,200 clicks): weekly rhythms, a few launch-day spikes, one
expired link and two switched off. Destinations and referrers use fictional
.example domains. Both accounts' password is shortwick-demo, and the
sign-in page lists them.
| Links | |
|---|---|
| ada@shortwick.test | 12 |
| grace@shortwick.test | 8 |
Country comes from a CDN country header (cf-ipcountry and similar) when one
is present, and otherwise from the region in the visitor's language setting.
Demo: Shortwick
MIT. See LICENSE.