How To Use The SongKick API

SongKick is a popular service that helps people find live music. Part of that equation includes musicians/bands updating their upcoming tour dates on SongKick, so fans can know about shows in their geographic area. This is advantageous for musicians/bands because of the large fanbase surrounding SongKick and it’s simple integrations with third-party services like Facebook, Spotify, SoundCloud, and BandCamp.

In this article, we are going to look at how to use the SongKick API to display upcoming concert dates for a given artist. In this example we will be using JavaScript, but the steps can easily be applied to the language of your choice.

First, we need to identify the artist’s SongKick user ID. This can be found by searching for an artist and copying the string of number from the URL for their artist page. For example, if we wanted to find Taylor Swift’s user ID we could look at the URL for here artist page: https://www.songkick.com/artists/217815-taylor-swift and determine that her user ID is 217815.

No that we have the user ID, we can create a GET request to the SongKick API via the following URL://api.songkick.com/api/3.0/artists/217815/calendar.json?apikey=io09K9l3ebJxmxe2. This will return a JSON object containing the details for each event.

Here is what the full request would look like in JavaScript. Please note that I am using the Zepto.js library to make working with the GET request a little easier. I also added the jsoncallback=? parameter to the URL, which forces JSONP (you may not need this depending on the language you use).

var url = '//api.songkick.com/api/3.0/artists/217815/calendar.json?apikey=io09K9l3ebJxmxe2&jsoncallback=?';

$.getJSON(url, function(data) {
  var events = data.resultsPage.results.event;
  console.log(events); 
  
  events.forEach(function(item, index, array) {
    var event = array[index].displayName;
    console.log(event);
  });
});

The example above will print out the display name for each of Taylor Swift’s upcoming events. You can retrieve more specific information, like the start time or URL of the event, like so:

var event_start_time = array[index].start.time;
var event_url = array[index].uri;

All of this information is included in the JSON object that is returned by the API.

That’s all there is to it. You will probably want to print the events data to the screen and style it in some way, but that is beyond the scope of what I’m trying to do here. You can view a styled list using this method here:http://codepen.io/mattlitzinger/pen/rORoLO

Did You Find This Helpful?