- [Instructor] To get JSON data from a remote source
on the web starts with an HTTP request.
We're going to work with the h+ sport website,
which is a site for a fictitious company that we're using
just for this course,
the h+ website displays a number of products
that the company sells with a name, image,
and price for each one.
All of this product data on the page
is a result of an HTTP request for product data
and an HTTP response that contains that product data.
To make a request for data,
I need to send an HTTP request to a specific web address
called an end point.
An end point has a program running
that receives HTTP requests
and generates HTTP responses back.
For example,
these are the URIs of two end points
for the fictitious h+ sport company.
These may look like web page URLs,
but instead of returning an HTML document
to be displayed in your browser, they return JSON data.
Now building an HTTP request in a programming language
can be a little complex and it's beyond the scope
of what we're doing here,
but we can get a taste of what goes into an HTTP request
and how it works without writing code
by simply entering the URL for an endpoint in a web browser
and seeing what data we get back.
That means that the browser is generating the HTTP request
on our behalf.
The h+ site supports a product endpoint
that can return JSON containing data on h+ products.
If I want data on all h+ products,
all I have to do is send an HTTP request to this URL.
So in my browser address bar,
I'm going to go ahead and enter that URL.
And when I press enter my browser displays the data
I get back, which is not a webpage, it's just JSON data.
Now Firefox automatically renders this.
But the data that came in is actually JSON.
Unformatted one long string,
but it's much easier to read and understand
when the browser automatically parses it for us.
And so that's what I'm doing with these buttons up here.
We've got the raw data button that shows me the raw JSON,
there's a headers button that lets me see some components
of the HTTP,
but the JSON is really what's useful in understanding
what kind of content is here.
Keep in mind that although I'm using the browser to view
this response data, requests to endpoints for JSON data
are actually handled behind the scenes by webpage code.
So you don't usually see the raw JSON
in the browser window, but once that JSON comes in,
the webpage code can work with the data it's received
and format it to display it for users
like the h+ sport page is doing here.