Page Metadata & Resources Exercise

[00:00:00]
>> So for this exercise, what I would be asking you to do, is to go ahead and go to Google Fonts, grab a couple of fonts and then go ahead and import them onto your page and just load them up on their styles. So for the solution, so what I asked you to do is go into fonts.google.com and just grab any font that you like.

[00:00:24]
So it looks like, let's see, Qwitcher Grypen. That looks interesting, let's grab that. So we can go ahead and here we go. We have a link here that we can grab. So let's grab that and all we gotta do now is we're still inside of our homepage. So I can drop this in here instead cuz that was a fake link, and just uppercase all of these things.

[00:00:47]
And we do need to actually close these components though since we are inside of the single file component. And once we have that, we can do and we can check. So we can go inside of our homepage, and what you'll see now is that if you look inside of the head, here we go fonts.googleapis, go static.

[00:01:15]
It builds exactly as you would hope to without the need to like write a bunch of JavaScript to try to make that thing work. It really just felt more like a copy and paste. And that's as easy as it gets when it comes to not only configuring resources for your pages, but also if you wanna add metadata.

[00:01:30]
Cuz that's a big part, right? We're talking about SEO and that kind of stuff, right? People wanna be able to see, get their search results index and so being able to dynamically configure meta tags with certain descriptions that kinda thing that's a big deal. And so with this new way of configuration, it makes it a lot easier for people to configure all these different properties for their pages as they go.

[00:01:49]
As you can imagine for like the photos and to do things that we had, you could easily just be like there's my page title, there's a description, there's a site, you could do a bunch of stuff with it to actually inform people about your page