phoique/get-data-from-api-without-framework

Get instagram data from API without a framework (pure javascript)

Javascript

Get data from url (json format) and call getJSON function's callback.

var getJSON = function(url, callback) {
    var xhr = new XMLHttpRequest();
    xhr.open('GET', url, true);
    xhr.responseType = 'json';
    xhr.onload = function() {
        var status = xhr.status;
        if (status === 200) {
            callback(null, xhr.response);
        } else {
            callback(status, xhr.response);
        }
    };
    xhr.send();
};

I use an instagram api as a sample. You can use another api that return a json format data.

window.onload = function() {
    var htmlTemp = "";
    getJSON('https://www.instagram.com/explore/tags/instagram/?__a=1',
        function(err, data) {
            if (err !== null) {
                console.log('Something went wrong: ' + err);
            } else {
                data.graphql.hashtag.edge_hashtag_to_top_posts.edges.forEach(function(item) {
                    //create your template
                });
                document.querySelector('#insTable tbody').innerHTML = htmlTemp; // append your template
            }
        }
    );
};

jsfiddle

https://jsfiddle.net/mgulener/1bnh5brp/1/