Quail Counter
I made a Gambel’s Quail counter.
Its like a “Like” button but better.
They normally live in the bottom-right corner of posts but here’s a big one for you to click:
It is a custom SVG that I made by drawing geometric vector shapes on top of a photo. When I export the shapes to SVG I’ve got a beautiful scalable male Gambel’s Quail.
When you click the quail not only does it do a little jump, it triggers a function that synthesizes an approximation of a Gambel’s Quail song.
Part of why I can do this more easily is I ported my portfolio to Astro. I can drop a Quail svelte component in, which calls a dynamic API route that lives within my project, which interacts with a database to persist the count. Every bit of code is in one git repo instead of spread out across multiple platforms. Astro DB adds some nice features that make working with a database in development and production more seamless.
I expect to add more whimsy and interactive bits soon.
Claire
<Click> oh yeah <click> vounce, quail, bounce!