Modern APIs with FastAPI and Python Transcripts
Chapter: Accepting inbound data
Lecture: Showing recent events on the home page
Login or purchase this course to watch this video and the rest of the course contents.
0:00 Well, we're able to create some reports. And if we go and run our report apps and say "show me the reports", I guess they're not there anymore.
0:10 A new report. This will be in New York City now we can see them. There's some reports there. If we go to the home page,
0:17 you don't see anything. Just see here's some examples of how you might call this, and we are not even documenting all the API here.
0:23 But nonetheless, what I would like to do is I would like to also show those reports right here on the home page,
0:29 just below this example. It doesn't necessarily make sense for this project, but just to show you sort of integrating into the templates.
0:36 So let's go over here. Look at our view and our home. And over here we're returning a template response. And what else? Maybe we wanna include
0:44 this is all the data that is available to the template. Maybe we wanna have events or reports or something like that. How do we get that? Well,
0:52 that is super easy. We go, we put this into a separate library on purpose. Report service like that, and we just say get reports, there we go.
1:01 That is it. Actually, is this async? It is async, so we need to await it. Await it, which means this needs to be async. There,
1:10 that's that. And this data over here is going to be available to the template, so I'll put that maybe separate, like this.
1:18 We're gonna pass this data over, and it will have events. And let's just go and add that down here, under
1:23 home, under index. What do we want to do with this? After the list, after this. So if there are some recent weather events,
1:36 let's just do a ul with an li inside of it. And then this we're going to repeat, we'll say "for e in events". Notice, we're not getting help here,
1:51 so we probably need to set our template language to Jinja, there we go. So we're going to put in here. We're gonna put just put "e.description".
2:03 Let's just put the city first "e.location.city e.location.country and a colon". Alright, so nothing happening there yet.
2:18 We're gonna need to go and create one again, aren't we? Let's go back to our little client and say, I want to see the reports. Oh,
2:24 no, it should be there says New York City has a report. Uh, what happened? I haven't restarted the app, and the app over here to
2:31 be rerun, to do this of course, that's going to mean it's empty again, we're gonna need to do report. It's raining, raining in Seattle. Wow.
2:43 And let's add another report. It's frosty in Portland. Now we see them. There's two. Over here, check that out. Recent weather events Portland,
2:54 US. It's frosty. Seattle, US. It's raining. We could even do something to combine these. That might be fun. We could go and say,
3:02 give us the actual temperature. And when we create these events, right. So over here, when we do this add report,
3:11 we could actually store as part of the report, stuff that we get back from our weather service here, like submit a city we said,
3:18 Well, let's pull up the temperature and store that we could make this really interesting and intertwined, but hopefully you get the idea.
3:24 Let me add one thing. If there's no recent weather events, I would like to just not show that. So let's do that real quick. Alright, so if we
3:36 refresh this, that shows up. But if I restart it which will empty out our events, now it's empty.
3:44 Once we add one again reports some weather it's raining, raining Seattle. Refresh it. Boom, they come back.
3:52 OK, so just to show you the data that we're working with over the API, totally makes sense to have maybe some client reporting it,
4:00 but the Web app showing it. Anyway, Hopefully that diversion between creating the client and showing it here on the page was worthwhile
4:08 You can see it's really, really, really easy to do. That's the HTML we had to write. That is the API or view method code
4:19 we had to write. All this stuff was already done, it's just putting the larger building blocks together.