Free eBook: Build Your First Node App

Getting Started with JavaScript for Web Development: Lesson 22 of 23

Getting Real Data with fetch

Up Next

Wrapup

Autoplaying in 7 seconds!

Cancel

https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API

https://scotch.io/tutorials/how-to-use-the-javascript-fetch-api-to-get-data

The Fetch API allows us to get data from an external source easily. We will be returned a Promise which we can use .then() on.

Table of Contents

    Using fetch

    fetch(url) // Call the fetch function passing the url of the API as a parameter
        .then(function() {
            // Your code for handling the data you get from the API
        })
        .catch(function() {
            // This is where you run code if the server returns any errors
        });

    OpenGraph.io

    https://www.opengraph.io/

    Credentials:

    const apiUrl  = 'https://opengraph.io/api/1.0/site';
    const appId   = '58858c7bcf07b61e64257391'; 

    If these no longer work and they have hit their limit, you will have to create your own OpenGraph account and get credentials.

    Chris Sevilleja

    173 posts

    Founder of Scotch.io. Google Developer Expert in Web Technologies. Slapping the keyboard until something good happens.