A URL shortener with click analytics, built by Claude Code on 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.
How it's built
Shortwick 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.
Why Elements
Elements is an integrated full-stack app framework and a project server. The project server checks the agent's work as it builds: it type-checks the server and browser code, analyzes the program, applies migrations and runs the tests, then reports the results to the agent. A security mistake, such as calling a server-only function from the browser, is a compile error. The agent reads the report and fixes its own mistakes before it tells you a feature is done. The same checks run on every feature you ask for next.
Run it yourself
- 1 Sign up
Already have an account? Sign in
- 2 Install and run the demo One prompt to paste into your agent.
The prompt
What Claude was given to build this app.
Build a URL shortener named shortwick with click analytics. - Accounts. Shorten a url, with an optional custom back-half and expiry date. - Short links redirect instantly. - Each link's analytics: clicks over time, top referrers, countries, and devices. - Tag links, search them, and turn a link off. - A QR code for each link, downloadable as PNG. Seed two users with twenty links and three months of click history. Show the seeded logins on the sign-in page. Click counts update in real time.