DEV Community

Cover image for Mini site for recommending songs using Svelte & Deno
Bryce Dorn
Bryce Dorn

Posted on

Mini site for recommending songs using Svelte & Deno

Introducing a new way to recommend a song to your friends: listn.fyi! Simply create a public Spotify playlist and name it "listn.fyi" (without quotes) then head to the URL for your Spotify username (e.g. listn.fyi/combatfetus). Et voilà! The link is shareable and any changes to your playlist will reflect immediately on the website.

I figure this could be a fun and easy way to share what you're currently into and see what others are recommending as well. Maybe a cheeky addition to a Twitter bio, etc.

Behind the scenes is a simple Sveltekit-powered server function to fetch a Spotify client token then find a user's recommendation playlist and its track information. A Deno edge function to performs this data fetch and renders server-side Svelte.

And shoutout to Rob for the beautiful CSS record player, which I borrowed (with credits) and made some modifications to. Long live skeuomorphism!

I must admit, the Sveltekit developer experience in 2024 is a lot nicer to work with than what I'm used to in the React/Vue/Next world. The filesystem-based router seemed like it would be a pain but was pleasantly surprised by how simple and clean it is to actually use. Looking forward to using it more for projects like this.

Check out the source below & let me know what you think!

GitHub logo brycedorn / listn.fyi

Recommend a song to your friends via a playlist! Try it out: https://listn.fyi/combatfetus

Top comments (0)