I've spent way too much time struggling and I can't seem to concentrate anymore.
My goal is simple - I just want to fetch JSON data from a URL and display it visually in the browser. It doesn't even have to be formatted, at least not until I overcome this obstacle.
Although I managed to get it to appear in the console using console.log, I'm struggling to pass the response to the render method. I've simplified the code below to try and at least see something on the webpage.
import React, { Component } from 'react';
var co = require('co');
co(function *() {
var res = yield fetch('https://api.stackexchange.com/2.2/search?order=desc&sort=activity&intitle=perl&site=stackoverflow');
var json = yield res.json();
console.log(res);
});
class App extends Component {
render() {
return (
<div className="App">
INSERT JSON HERE
</div>
);
}
}
export default App;
I also managed to retrieve the response using:
fetch('https://api.stackexchange.com/2.2/search?order=desc&sort=activity&intitle=perl&site=stackoverflow')
.then(function(res) {
return res.json();
}).then(function(json) {
console.log(json);
});
Initially, I opted to use axios because my initial thought was "oh well, I'll use axios because who's awesome? I'm awesome."
axios.get('https://api.stackexchange.com/2.2/search?order=desc&sort=activity&intitle=perl&site=stackoverflow')
.then(function(response) {
console.log(response.data);
});
However, that turned out to be wrong as today, I am far from feeling awesome.
I would appreciate any help I can get! In my original plans, I intended to use map to iterate over the "items", so additional points if you can guide me closer to success in that aspect.