Full Web Apps with FastAPI Transcripts
Chapter: View models and services
Lecture: View model pattern visualized
Login or
purchase this course
to watch this video and the rest of the course contents.
0:00
Before we start writing code around this view model pattern, let's just take a high level conceptual look at where it fits in the whole web
0:07
application process. So on the left we have what I imagine, some kind of HTML form where data is being exchanged with a browser.
0:16
So the form represents like, say, the Chameleon or Jinja template. And it's got all the data that the users typing in
0:22
and is going to be submitting back to the application. The application may also need to provide some data to that form.
0:29
Like, for example, if there's a drop down of countries that you wanna pick Well, you've got to send over those countries to that form. Most likely you
0:35
don't want to hard code that into the HTML. This view model, its job is going to be to manage that exchange.
0:41
So on the left, we've got a browser with an HTML form that is driven by a template. On the right,
0:47
we've got a big action method because, what happens here? when they submit this form for in this case, registering for our site,
0:54
they're gonna put in their first name, their last name, their email address. Maybe they've gotta checkoff a re-captcha type of thing to make sure that
1:01
they're not some kind of bot, and so on. Our website, our action method over here, our view method is going to actually need to look at that and
1:09
say, well, did they supply a first name? Yes or no? Did they provide a last name? Yes or no? If they don't provide the last name,
1:15
tell them they have to provide the last name. If they provided an email, make sure that it's actually a proper valid email,
1:21
not just some random text. Did they provide a password? Is it secure enough? Like all of those things have to happen.
1:28
And then we go and create the user. And at each step, if something goes wrong, we need to send back a message like,
1:34
hey, this didn't work. And very importantly, we need to round trip that same data, if they typed in first name and last
1:42
name and email. But email wasn't right, we want to reload that form with the same first name, the same last name and the same email and just say,
1:49
here's what you typed, but please correct it. That is a really important part here as well. So the job of this view model is instead of writing all of
1:57
that just in this one view method, this action method, which makes testing hard, which makes editing the code or adding features really hard.
2:05
We're gonna break this action method into another part, using this view model. So it will have a small little action method.
2:11
And the view model will be a class whose job is to understand all the data that the page needs, all the data that the user is supplying,
2:19
how to round trip it and how to validate and report errors on it, as I just described. And then this action method is just going to say,
2:25
hey, they submitted the form, please load it up and tell me if it's good. If it is, I'll create the user.
2:30
If it's not good, we'll just send back that same data you have along with the error message. That's the idea of these view models.
2:36
And like I said, it sounds like Pydantic would be a really nice choice here. But there's a couple of problems. Pydantic, when it runs into errors,
2:44
it doesn't hang on to the data anyway and then let you send it back. It just crashes and says, hey, we tried to accept this data.
2:51
It wasn't right. Sorry. And while that's super perfect for what you need in an API, it's not what you want for a web page.
3:00
We'll see some concrete examples of this later when we actually write the registration method in the next chapter. But for now,
3:07
let's just put it to the side that Pydantic models are perfect and such a cool library and way to work with data exchange with FastAPI for the API
3:16
side. But they don't make as much sense when you're trying to make a web application with HTML templates. We'll come back to this in more detail,
3:23
and we'll see exactly why that is, later. Here's what the view model pattern looks like and how we're going to use it to
3:29
isolate the data exchange between the HTML template and some of our code and not mix that in all over the place.
3:35
Make it easier to test that data exchange validation, and it will keep our view methods nice, clean and simple