At Parabola we really like music: every Wednesday you’ll find the team listening to a different collaborative playlist based around a theme. Recent features have included: breakup songs, hot girl summer, and music suggestions for my upcoming wedding.

If you’re a music lover, going to concerts is the best way you can show support for musicians. Even better: go to concerts and buy a t-shirt; merch sales are a great way to directly support artists you care about.

Spotify has great support for discovering local concerts for bands you already love, but what about bands you haven’t discovered yet? If you really want to see a concert this week, but aren’t sure who to see — you’re a bit out of luck.

That’s why we decided to build Discover Local. Modeled after Spotify’s popular Discover Weekly playlist, Discover Local is a weekly playlist of music from artists who are performing in your city that week. Every Monday morning you can throw it on, find a new artist to love, and see them play live before the end of the week!

The best part? We built the entire product with zero code using Parabola and Webflow!

This article takes a look at how we actually made it happen, but if you just want to see the finished product you can click here to check it out.

Overview

The high level program design is as follows:

• Local concert information comes from Songkick
• Tracks and playlists are sourced from Spotify
• Everything gets mashed up and organized in Parabola
• Content is pushed directly to Webflow

Seems simple, right? For the most part it is, but there are a few sticking points we’ll take you through below.

Deep Dive: Weekly Spotify Playlist for Local Shows

The first chunk of the program fetches upcoming concerts from Songkick. We use a simple Google Sheet to keep track of which cities we want to build playlists for, and to keep track of the date one week from now.

Mapping City Names to Metro Ids

Our first task is to map the name of each city to its corresponding Songkick metro id; metro ids are unique identifiers that ensure Songkick always knows which Washington it’s talking about (there are 88 of them!).

To do that, we use a Parabola step you’re going to see quite a lot throughout this article: API Enrichment. API Enrichment makes a web request against a URL you specify once for each row of data you pass to it. The step’s other superpower is that it can dynamically substitute values from your data into the URL (or a POST body). If you want Parabola to insert a value from your data into the URL, all you have to do is type the column name wrapped in curly braces, e.g., {Your Data}, and we’ll take care of the rest.

So in this case we have a list of cities, and we’re going to make a request to Songkick’s location search API once for each.

https://api.songkick.com/api/3.0/search/locations.json
?query={Cities}&apikey=YOUR_API_KEY

Songkick sends back multiple possible locations per input, but for now we’re just going to assume the first one returned is the one we want. We use the deduplicate step to trim our data so we only have one metro per input city, and now we’re ready to fetch concerts!

Fetch Concerts in Each City

We use the API Enrichment step again to ask Songkick for all concerts taking place over the next week in the specified metro area. This API call requires pagination, and you can check out the flow template to see how you set that up in Parabola.

https://api.songkick.com/api/3.0/metro_areas/{api.metroArea.id}
/calendar.json?apikey=YOUR_API_KEY&per_page=50&max_date={Date}

It turns out there are a ton of concerts every week, and each concert has multiple performers. To keep this simple, though, we’re only going to keep the top twenty from each city, and we’re only going to consider artists with first or second billing. We do that by first sorting the data, filtering by billing index, and finally using the dedupe step again to retain only the twenty most popular concerts for that week.

‍

Source Songs from Spotify

So at this point we’ve got a list of twenty artists in each of a handful of cities around the world.

Note: the program works with any city that Songkick & Spotify support, but to keep it simple we’ve only seeded a few on Discover Local right now. Let us know if you want to see a playlist for your city!

We need to map the artist names that we got back from Songkick to their unique identifiers in Spotify (just like we did with city names and metro ids!). We do this by calling Spotify’s search API with the artists’ names:

https://api.spotify.com/v1/search?q={Arist Name}&type=artist

Again, there are multiple artists with the same name. We’re just going to assume that the one with the most followers is the one we want: we sort by popularity, and dedupe again, letting Parabola know that we want to keep at most two duplicates.

Note: Spotify APIs use OAuth — so you’ll need to set that up before interacting with Spotify in Parabola. You’ll want to use the Authorization Code Flow. If you get stuck, we have a very well-written guide to talk you through it. Shout-out to Brian.

Now we want to fetch each artists’ top tracks:

https://api.spotify.com/v1/artists/{api.id}/top-tracks?country=US

Easy!

Compose Playlists

With tracks in hand, all that’s left is to compose them into playlists and send them over to Spotify.

We can use Parabola’s group by step to concatenate all the track uris into a single column, and now we’re ready to use an API Export to sync our new playlists to Spotify.

https://api.spotify.com/v1/playlists/{Playlist Id}/tracks?uris={Tracks}

But wait — what if the playlist for a particular city doesn’t exist yet? What about the tracks that are still in the playlist from last week?

Here’s where things get cool.

We need to implement a little create/delete procedure for our Spotify playlists before we can ship them:

• If a playlist doesn’t exist yet, it should be created
• If a playlist exists, we should clear its contents to make way for new songs

Note: Until recently it was pretty tricky to do something like this in Parabola, but one of our rockstar engineers, Michelle, made it so that API Exports can now block and wait until an external update completes before proceeding!

At a high level what we want to do is partition the to-be-created playlists into two groups: those that exist in Spotify already and those that don’t. We first join the to-be-created playlists with a list of playlists fetched directly from our company’s Spotify account, then we branch the program down two paths. We use two row filters to ensure that only relevant rows make it into each branch.

For playlists that don’t exist yet, we run an API Export to create them:

https://api.spotify.com/v1/users/{id}/playlistsBody{
    "name": "{Playlist Name}",
    "public": {public}
}

Then we re-fetch the list of playlists from our company’s account so that we get back the playlist ids for those that were just created.

For playlists that need to be cleared, we use an API Enrichment to fetch the list of tracks currently in the playlist, concatenate them like we did for the new tracks just above, and then use a different API Export to clear them:

https://api.spotify.com/v1/playlists/{api.id}/tracksBody{
  "tracks":[
     {
        "uri":"{api.track.uri (concat)}"
     }
  ]
}

Send Playlists to Spotify

Now that our to-be-created playlists have either been created or cleared, it’s finally time to send them to Spotify!

To do that we’ll use one last API Export, and send the concatenated track list we created in the previous step over the wire:

https://api.spotify.com/v1/playlists/{Playlist Id}/tracks?uris={Tracks}

Note: there is another chunk to this program that takes the playlists and pushes them into Webflow’s CMS. We haven’t had a chance to document that bit yet, but you can click this link to create a new flow with it and explore how it works for yourself!

Conclusions & Future Work

We hope you enjoy listening to Discover Local — maybe you find a new favorite artist and make your way to their show!

If you’ve made it this far, you likely also find it cool that we were able to build this with absolutely no code in a couple of afternoons.

Building in Parabola is really fun and empowering. There is no app to download or libraries to install; you don’t even have to pay us — just jump in and get started!

We handle all the infrastructure pieces like scaling up/down, network I/O, and scheduled executions. As a builder, you can focus on what is actually important: the logic of your program.

Our team in San Francisco is laser focused on making Parabola a place for people to build awesome stuff. If you have ideas for features we should support, want to showcase something you built, or want a job — get in touch.

‍