Hey, welcome back.
I want to take a quick second to talk about this idea of data transfer from servers to the browsers.
Now, we saw that when we opened the developer tools.
We can go to the network tab and actually see what type of data gets sent from the server.
And here we saw that there's different types, but we mainly talked about HTML, CSS and JavaScript,
but we also see that there is a few other types in here.
If I click on, let's say the HTML, there's this field called content type that says it's a text HTML
file.
Now this is something quite important because it uses something called a mime type and it stands for
multipurpose Internet mail extensions.
Sounds very impressive, doesn't it?
And you see here and I'll link to this resource and let's make this a little bit bigger that browsers
use this mime type, not the file extension to determine how to process a URL.
So they look at the content type that our Flask app actually automatically sends to the browser to determine
what to do with that file so that they know, Hey, is it an HTML file?
Is it a CSS file?
Is it a JavaScript file?
Now, at the end of the day, all this data that we're transferring, it's all just text, but they
can be in different forms and the browsers can interact with them in different ways.
For example, if we scroll all the way down here.
We have different types, but we want to focus on the important mime types for web developers.
We have things such as plain text.
We have CSS.
We have HTML.
We have JavaScript.
So that if I go to the.
JavaScript file here and I go to content type.
I see that, yeah, it's application JavaScript and we see here that there's a little note about why
it's application JavaScript here.
Instead of text JavaScript.
Either way.
This way the browser knows.
I'm about to read a JavaScript file.
Do some certain things because it is a JavaScript file.
Now if we keep scrolling down, there's also image types.
So again, if we look at the images, let's say the PAG, again, if we scroll down we see that it's
an image PAG at the end of the day it's actually text that we receive from the server but in a way that
it can be read as a PNG file.
So based on this knowledge, websites work by sending all this data and letting the browser take care
of well, building the page for us.
Now so far we've only talked about HTML, CSS and JavaScript, and usually that's how websites are displayed.
But there's different ways that we can also use servers such as what we call API endpoints.
So right here I have the Sloppy SEO, which stands for the Star Wars API.
And what it does, as you can see here, is it sends us data.
So instead of displaying a web page, it just sends us information.
So for example, if I copy this.
Like so.
And then let's say we do people over here.
So let's do people.
If I hit enter.
Look at that.
I get this data.
And this content type is what we call JSON.
And JSON is just this format of data that we can use in our applications.
So again, a website might take this data and perhaps display the name Luke Skywalker on the front page.
So this endpoint, instead of sending HTML, CSS and JavaScript just sends us this JSON data because
at the end of the day, all a server does is send some data, right?
It serves data.
We can send all sorts of things, for example, this robo hash website.
If I do, let's say anything I want in here and I hit enter, it sends me a random image of a robot
if I change anything in the standpoint.
I get a different robot.
So Web developers and mobile developers use this idea of servers all around the world to try and grab
information, grab data from a server and display something useful on a browser.
And I hope this shows you the power the servers have.
We can do anything.
The options are limitless.
And we can build all sorts of servers with Python to do all sorts of things for us.
All right.
Let's get back to our portfolio website.