1
00:00:00,330 --> 00:00:00,600
All right.

2
00:00:00,600 --> 00:00:01,650
Welcome back.

3
00:00:01,680 --> 00:00:04,890
So we talked about what API is our what it is what the term stands for.

4
00:00:04,890 --> 00:00:07,360
We talk to some examples.

5
00:00:07,530 --> 00:00:13,410
Next we're going to talk about how they work and not just you know how they're structured but what they

6
00:00:13,410 --> 00:00:16,710
send back and what the data looks like.

7
00:00:16,890 --> 00:00:22,060
So what this giant mess was here and and why is that better than HMO.

8
00:00:22,980 --> 00:00:28,550
Before we do that I have this little graphic here of you know a human interface to iTunes.

9
00:00:28,620 --> 00:00:34,270
You can see you know the iTunes browser.

10
00:00:34,590 --> 00:00:39,350
But then here is what you get from the iTunes API.

11
00:00:39,780 --> 00:00:42,900
So this is you know a much cleaner much more simplified.

12
00:00:43,020 --> 00:00:48,630
And this is you know a nice cleaned up version that's color coded but it actually really looks like

13
00:00:48,630 --> 00:00:49,170
this.

14
00:00:49,350 --> 00:00:51,190
But it's pure data that we get.

15
00:00:51,210 --> 00:01:00,060
So it's still you know album names and you are extra images and dates and ratings and prices but rather

16
00:01:00,060 --> 00:01:01,350
than this format.

17
00:01:01,800 --> 00:01:04,690
And as you can see here I'm actually searching for Beyonce.

18
00:01:04,920 --> 00:01:09,720
And then these are the results you see here.

19
00:01:09,870 --> 00:01:18,060
What I'm doing is writing an API call that will do the same thing search for Beyonce music videos.

20
00:01:18,210 --> 00:01:20,450
So this is how the API is structured.

21
00:01:20,490 --> 00:01:25,560
You this is changes from every API you have to read the documentation which is what I did here.

22
00:01:25,650 --> 00:01:30,140
But if you make a request to this you Arel which I'll do right now.

23
00:01:32,580 --> 00:01:39,090
And we look at what is the response it's going to be hard to read because it's just a chunk of text

24
00:01:39,090 --> 00:01:39,740
.

25
00:01:39,810 --> 00:01:47,370
But this is the underlying information about Looks like 50 Beyonce music videos.

26
00:01:47,850 --> 00:01:54,060
So I could use this if I wanted to build a Beyonce music video viewer application or Beyonce music video

27
00:01:54,120 --> 00:01:59,290
shuffle app that would just pick one and play it randomly.

28
00:02:00,030 --> 00:02:00,350
OK.

29
00:02:00,360 --> 00:02:08,160
So again the key here is that this what you're seeing here is a representation of you know a computer

30
00:02:08,160 --> 00:02:10,180
interface a code interface.

31
00:02:10,830 --> 00:02:18,240
So here are some other end points which is the term for these you or else of the iTunes API or one of

32
00:02:18,240 --> 00:02:20,460
the iTunes API is the search API.

33
00:02:20,970 --> 00:02:24,270
So you can search for Beatles songs and this is what you would do.

34
00:02:24,570 --> 00:02:31,710
And tity song term equals Beatles can search for podcasts about code Harry Potter movies.

35
00:02:32,250 --> 00:02:37,290
And this is just to show you that you know this is how the iTunes API is set up.

36
00:02:37,290 --> 00:02:40,290
It's not a pattern that you would follow for other API.

37
00:02:40,300 --> 00:02:46,020
Again you just figure it out using the air using the documentation for the particular API you're interested

38
00:02:46,020 --> 00:02:46,670
in.

39
00:02:47,070 --> 00:02:51,640
OK so what is this stuff that we see here.

40
00:02:52,080 --> 00:02:58,510
There are two main formats that API of web API is responded with nowadays.

41
00:02:58,740 --> 00:03:00,430
We're used to him owl.

42
00:03:00,570 --> 00:03:02,190
That's what everything we've done so far.

43
00:03:02,190 --> 00:03:07,500
Response with the you know the app this Web site I'm looking at now here is written and edged him out

44
00:03:07,510 --> 00:03:07,610
.

45
00:03:07,710 --> 00:03:12,110
My browser takes it displays it for me nicely but there's a lot of extra stuff in there.

46
00:03:12,120 --> 00:03:17,170
We talked about we don't need we don't want when we're asking for data from an API.

47
00:03:17,490 --> 00:03:19,600
We don't want that structure of the page.

48
00:03:19,770 --> 00:03:22,910
The color that we just want the content that underlies it all.

49
00:03:23,130 --> 00:03:30,390
So these two formats that are most commonly used are called SML and Jaison so SML will start with that

50
00:03:30,540 --> 00:03:35,250
stands for extended markup language or extensible marketplace bridge.

51
00:03:35,370 --> 00:03:42,270
It's very similar to h tim L and the syntax is you can see here we have these angle brackets opening

52
00:03:42,270 --> 00:03:44,740
and closing tags that slash.

53
00:03:45,120 --> 00:03:51,210
Where it's different though is that it doesn't describe presentation or structure of of the presentation

54
00:03:51,230 --> 00:03:51,550
.

55
00:03:51,630 --> 00:03:55,840
We're not saying that this is bold and this is a list item.

56
00:03:56,370 --> 00:04:05,940
All that it does is code key value pairs so data as you can see here this is a person tag and instead

57
00:04:05,940 --> 00:04:12,030
of a person there's an age that's 21 a name which is Traveston city which is Los Angeles.

58
00:04:12,510 --> 00:04:19,110
So key value pairs you can nest things inside of each other and there's no real rules on what you can

59
00:04:19,110 --> 00:04:19,470
put here.

60
00:04:19,470 --> 00:04:25,590
So it's not like edged him out when those particular tags you put whatever tags you want and this is

61
00:04:25,590 --> 00:04:27,110
one way of encoding data.

62
00:04:27,300 --> 00:04:32,560
And then our code would get this back and it would be able to understand.

63
00:04:32,610 --> 00:04:37,940
OK this is a person and has an agent name and a city and city is Los Angeles.

64
00:04:37,980 --> 00:04:45,300
Jason is another way of storing data and sending that data back without any of the pretty Chimo or ugly

65
00:04:45,300 --> 00:04:47,050
depending on who you are.

66
00:04:47,280 --> 00:04:52,400
But none of that extra stuff and stands for javascript object notation.

67
00:04:52,860 --> 00:04:57,580
And if you're familiar with javascript objects what you should be this will look very familiar.

68
00:04:57,600 --> 00:05:00,190
So this is the exact same data we had here.

69
00:05:00,420 --> 00:05:02,940
A person who is age 21 name is Travis.

70
00:05:02,940 --> 00:05:05,890
City is L.A. using Jaison.

71
00:05:06,360 --> 00:05:14,130
So we have an object where we have person which is another object where we have age or just 21 name

72
00:05:14,130 --> 00:05:19,600
is Traviss city is Los Angeles so it's just another way of storing data.

73
00:05:20,030 --> 00:05:20,970
Either one works.

74
00:05:20,960 --> 00:05:22,910
There are other options as well.

75
00:05:23,000 --> 00:05:29,540
Ex-MIL used to be used a lot more than Jason Jason though is quickly become much more popular and the

76
00:05:29,540 --> 00:05:34,310
main reason for that is that a lot of times we're making API calls.

77
00:05:34,300 --> 00:05:35,630
We're using javascript.

78
00:05:35,750 --> 00:05:42,430
So when we get this data back in it looks like this and we're in javascript so I have a javascript application

79
00:05:42,830 --> 00:05:48,180
and I'm asking for weather data and it comes back as Jason.

80
00:05:48,470 --> 00:05:54,800
Well then I can very quickly use it in my javascript I don't have to convert it from this format into

81
00:05:54,800 --> 00:05:56,060
a javascript object.

82
00:05:56,060 --> 00:05:58,990
I can read it from this which is basically Javascript.

83
00:05:59,340 --> 00:06:01,640
And very quickly or it's very quick.

84
00:06:01,640 --> 00:06:08,270
One thing though to note you do need quotes around the Keys so it's not exactly javascript do need quotes

85
00:06:08,270 --> 00:06:11,410
around the Keys but it's very very similar.

86
00:06:11,840 --> 00:06:17,300
And again I have a comparison here if you want it just you know look at them side by side same data

87
00:06:17,390 --> 00:06:19,230
represented differently.

88
00:06:19,820 --> 00:06:26,180
So Yahoo has a weather API that we're not going to use right now but I'm showing it to you the documentation

89
00:06:26,180 --> 00:06:31,950
for it at least because it allows you to toggle between Jason and Zemo.

90
00:06:32,660 --> 00:06:36,590
So what we have here are a few example requests requests.

91
00:06:36,590 --> 00:06:44,780
So if I wanted to figure out how to ask for the sunset time and Hawai it will show you first down here

92
00:06:44,780 --> 00:06:47,110
this is where you need to make a request.

93
00:06:47,120 --> 00:06:53,630
So this long URL looks kind of crazy but this is where you would need to request and you need to write

94
00:06:53,630 --> 00:06:54,590
.

95
00:06:54,710 --> 00:06:55,980
Let's see.

96
00:06:56,090 --> 00:06:59,690
Select astronomy sunset from weather forward.

97
00:06:59,690 --> 00:07:05,480
So this giant thing you don't need to worry about it too much but there is this one part format equals

98
00:07:05,480 --> 00:07:10,780
Jaison and the one you make this request which we can do on our browser.

99
00:07:11,000 --> 00:07:12,600
This is what you get back in.

100
00:07:12,830 --> 00:07:18,400
So it looks like sunset and Hawai is at 6 or 5 p.m. so I can do that.

101
00:07:18,750 --> 00:07:23,070
I can also just request that and I get that response right here.

102
00:07:23,180 --> 00:07:31,340
So it's just a regular request but I can also switch to SML and you'll see the exact same information

103
00:07:31,340 --> 00:07:32,150
.

104
00:07:32,150 --> 00:07:36,450
It's just looks a little different and how it's formatted but the same information is here some said

105
00:07:36,440 --> 00:07:40,730
is 6:55 p.m. It's a little clunkier to use SML.

106
00:07:40,760 --> 00:07:49,130
Some of the older API is only support Exham but most new things support Jaison is pretty rare nowadays

107
00:07:49,130 --> 00:07:52,650
to find a new thing a new API that only supports X-amount.

108
00:07:52,910 --> 00:07:57,920
So we're going to focus on Jason but I want to hammer the point home that they are just both formats

109
00:07:57,940 --> 00:07:58,430
.

110
00:07:58,820 --> 00:08:04,220
Given this situation where we have let's say you know yahud weather has data and it wants to get it

111
00:08:04,220 --> 00:08:07,430
to us well it's not going to send it as a demo.

112
00:08:08,210 --> 00:08:13,910
But there needs to be a predictable format for it to send it in so that we can kind of Dakota and unwrap

113
00:08:13,910 --> 00:08:16,260
it and you know get meaning from it.

114
00:08:16,280 --> 00:08:20,190
SML is one option but Jason is a much easier option.

115
00:08:20,420 --> 00:08:26,210
It's shorter usually a lot less text where we don't have to write these closing tags but it also just

116
00:08:26,210 --> 00:08:31,420
works really nicely with javascript which is what we're doing most of the time.

117
00:08:31,520 --> 00:08:37,710
So with all of that said if we go back here this is Jason just to refresh your memory.

118
00:08:37,790 --> 00:08:45,900
This is the underlying API that Jaison API for readed in particular for our Shlash Ah adorable photos

119
00:08:45,890 --> 00:08:46,670
.

120
00:08:46,740 --> 00:08:48,320
This is the underlying J song.

121
00:08:48,920 --> 00:08:52,340
And it's kind of a mess to look at.

122
00:08:52,430 --> 00:08:59,070
There is a chrome plugin or a chrome extension or like to use called Jason view or on.

123
00:08:59,100 --> 00:09:02,840
You were just on view.

124
00:09:02,850 --> 00:09:04,860
It's a chrome extension.

125
00:09:05,250 --> 00:09:09,350
It makes Jason look like this where you can kind of explore easier.

126
00:09:09,380 --> 00:09:11,330
So I'm going install it here.

127
00:09:11,690 --> 00:09:19,370
And then when I go back and I make that same request it takes a moment.

128
00:09:19,380 --> 00:09:24,930
So you can see I see the original and then the nice formatted version from the extension and it's a

129
00:09:24,920 --> 00:09:26,930
lot easier to see the information.

130
00:09:27,120 --> 00:09:31,830
And there's still a lot here but I can see the structure now how things are related.

131
00:09:31,860 --> 00:09:33,180
You can see that it's Jason.

132
00:09:33,170 --> 00:09:35,030
So we have the curly braces.

133
00:09:35,030 --> 00:09:37,000
See if I can make this a bit bigger.

134
00:09:37,700 --> 00:09:39,860
We have the key value pairs.

135
00:09:40,220 --> 00:09:43,660
We have you know array brackets strings numbers.

136
00:09:43,730 --> 00:09:44,870
All this stuff in here.

137
00:09:44,960 --> 00:09:51,390
And what's nice is that I can close things down expand them and explore the data rather than that giant

138
00:09:51,380 --> 00:09:55,010
mass that you could see here.

139
00:09:55,010 --> 00:09:57,350
It's the same code it's just formatted nicely.

140
00:09:57,360 --> 00:09:59,750
So I highly recommend installing something like that.

141
00:09:59,780 --> 00:10:04,030
They make them for Firefox and pretty much every other browser out there.

142
00:10:04,340 --> 00:10:05,920
I highly recommend it.

143
00:10:05,930 --> 00:10:09,200
You can also just look for some viewer online.

144
00:10:09,260 --> 00:10:15,900
If you don't want to install an extension you can go to a site like this and paste in your Jason and

145
00:10:15,890 --> 00:10:19,070
then click on format no format it for you.

146
00:10:19,190 --> 00:10:25,470
So I could select all of this go here format and it does that as well.

147
00:10:25,550 --> 00:10:26,680
But it's not as interactive.

148
00:10:26,680 --> 00:10:29,620
I can't collapse it and expand it.

149
00:10:29,630 --> 00:10:36,760
So to wrap up Jason is one of the formats X-amount Jaison to most common for API is for web API has

150
00:10:36,770 --> 00:10:40,510
to respond with rather than HTML all that kinkiness.

151
00:10:40,550 --> 00:10:48,900
So what we'll be doing is writing applications that will make a request for this information and we'll

152
00:10:48,890 --> 00:10:50,120
get it back S.J. song.

153
00:10:50,300 --> 00:10:54,980
We won't be using this redit information but another japes on API will get that information back in

154
00:10:54,980 --> 00:11:01,470
or app will be able to use it very quickly and then do something with it save it to a database do some

155
00:11:01,460 --> 00:11:06,030
analysis on it and then show something to our user eventually as Kimmo.

156
00:11:06,290 --> 00:11:08,210
So you see how to do that in the next video