fetchAnnotated.js

/*
  First we must call the API.
  We can do that by using the built-in ES6 function called fetch.
  Fetch simply takes an end point (in this case, the URL that is in quotes).
*/
fetch('https://jsonplaceholder.typicode.com/users')
  /*
    Now remember what I said about an API's response?
    It usually spits out JSON which is close to a regular object.
    But not quite.
    Here we take the API_Response and call .json().
    This converts it into the regular everyday JavaScript object!
  */
  .then(API_Response => API_Response.json())
  /*
    Because these are arrow functions,
    API_Response.json() is now returned to the next .then.
    You can think of API_Response.json() is now equal to 'data'.
    So can you guess where that array of objects is assigned to?
    ...
    The array of objects is now assigned to 'data'.
    We can now access the first object's name by using data[0].name.
  */
  .then(data => console.log(data[0].name))