ReactJS Asynchronous Calls Dengan fetch

Pada kali ini saya akan mencatat tentang membuat http request secara async dengan cara menggunakan fetch.

Fetch Request

Saya akan mencoba untuk menggunakan public  API berikut ini untuk melakukan http request data-data filem yang ada http://api.tvmaze.com/search/shows?q=vikings 

// dipanggil otomatis saat component dimount

componentDidMount() {

// whatwg-fetch

fetch('http://api.tvmaze.com/search/shows?q=vikings')

.then((response) => {

console.log(response);

return response.json();

})

.then((json) => {

console.log(json);

this.setState({series: json});

});

}

+Render View

render() {

return (

<div className="App">

<Intro messages="Hai kawan lagi apa" person="Jonima" />

total series ada: {this.state.series.length}

</div>

);

}

Console log pertama dan kedua.

+Tampilan Di Browser

Tampilan di browser

Sumber
https://www.udemy.com/react-fundamentals/learn/lecture/9114730#overview
https://www.npmjs.com/package/whatwg-fetch#response-metadata