fetch('http://example.com/movies.json')
.then((response) => response.json())
.then((data) => console.log(data));
This looks to be something simple to use and and work with.
And it can be. What I have learned about using fetch is a winding rocky road. To start with, always check the URL(address), make sure it has the correct spelling and includes the endpoint that need or are using. Once that is working and you are getting a good response in the console, you need to start feeding it information related to your project. Here is an example of one that I wrote as a practice project:
//
fetch(url) <-gets the information from the API that you are using->
~ .then((response) => response.json()) <-converts the information into a readable format.->
~ .then((movies) => { <-This starts the iteration loop that will allow the proper information that come from the API to display on the page.->
~ movies.map(renderMovie) <-In this example, this line grabbed the picture of the movie and displayed it on the HTML page.->
~ movies.map(displayInfo) <-This line grabbed the remaining details (Title, Year it was released, and a brief description of the movie itself.->
});
//
It can be a confusing spot to get worked out of, just do not give up. We are all learning this together.
-getGoodNerd
Top comments (0)