Original subtitles

In the last section, we added in an image middle class to our project, we're now ready to make an

HTTP request over to that API, get our JSON data, and then create a new instance of an image model.

So to actually make the request, I'm going to flip back over to my app dart file.

So we probably want to make the request only when a user presses on that floating action button.

That makes sense, right?

When a user presses on that button.

That means it's now time to fetch one additional image from that Jason API, get back that JSON pass

it.

We get the image model and then we'll try to create a widget to show that thing on the screen.

So essentially inside of this unpressed callback right here is where we're going to want to fetch our

data.

Now, at this point, putting in a ton of logic into this function right here, it seems like we might

be putting in too much logic into this like, very confusing blob of code right here.

So rather than continuing to add on more code to this function, I think that we're going to create

a separate method on our app state widget right here.

And inside of that new method is where we'll put all the logic to fetch our data, do all this stuff

that we need to do.

So above my build method, I'm going to add on one additional method that I will call fetch image like

so I don't think Fetch Image is going to need to return any data.

I think that we just need to call it.

And I think this method should attempt to make the request and do whatever is appropriate.

So in other words, I'm going to market with a void type for the return type.

So now inside of on prest right here, rather than calling set state and rather than incrementing the

counter right here, I'm going to delete all that stuff.

And I will instead call fetch image.

Now, what we have right here is a function that simply calls another function, because we have a function

that calls another function, we don't really have to write out the outer function.

We can instead just provide a reference to the fetch image method.

So we'll just say, hey, unpressed whenever you get called or whenever we need to call a callback function

because the button was just pressed.

Here's a reference to a function that we want you to call.

So rather than writing out the outer function and the inner one, we can condense this.

So I'm going to delete that entire function right there.

And I can write out simply fetch image.

Like so.

Now, you'll notice that I do not have any parentheses on here, no parentheses, if I put parentheses

on, then that means that the instant the build method is called the fetched image method will be invoked.

And that's definitely not what we want.

So I'm going to take those parentheses off.

And now we are giving a reference to the fetch image function to this on prest property.

So any time the button gets pressed the button, it knows, oh yeah, I've got a reference or I got

a handle on the fetch image method that I need to call.

So now we can write all of our logic to go and attempt to fetch an image inside of the fetch image method

right here.

Call.

OK, so I'm going to save this, and now we need to somehow make our request, so that's the core of

what we're doing right here.

That's what we really want to do inside of each image.

We need to make an HTTP request over to that JSON endpoints.

So this URL right here.

So we want to go to Type II COCOM photos, the idea of the image we want to get.

So let's take a quick pause right now, we'll come back to the next section and start writing out that

code.