Using the Metro API – a guide for newbies

I’m going to show you how to use the Metro API.

This post is aimed at javascript beginners but i recommend you try out this fun interactive introduction first –

Step One. Create a  file on your computer. Call it something like “metro.html”.

Step Two. Copy the HTML below into it. Open the file in a browser and it should say “My metro articles”. (Not very exciting yet, i know).

<div id="myElement">My metro articles</div>

Step Three. Use the Metro API. You can see what the API looks like here.

Copy the following code before the </body> tag…

// This function will process the data
function init(apiData) {
  // Init variables
  var myHtml = '';
  var article;

  // Loop through each article in the feed, generating html as we go
  for (var i = 0; i < apiData.entries.length; i++) {
    article = apiData.entries[i]; // Get the relevant article
    myHtml  = myHtml  + "<a href=" + article.alternateLink + ">" + article.title + "</a></br>";

  // Insert our html into the page
  document.getElementById('myElement').innerHTML = myHtml;

<script type="text/javascript" src=""></script>

That’s it!

Refresh your browser and you should see a list of metro links. If you have any problems (and there usually are)…  just shout. To experiment more try our API Explorer (beta).

Leave a Reply

%d bloggers like this: