1
00:00:01,110 --> 00:00:02,040
Hey, welcome back.

2
00:00:02,070 --> 00:00:09,810
In this video, we will construct the API documentation page and the API page itself where the users

3
00:00:09,810 --> 00:00:11,310
can get JSON data.

4
00:00:11,490 --> 00:00:12,380
Let's begin.

5
00:00:12,390 --> 00:00:21,420
So far we worked on some examples which were not related to our app, so I just wanted to introduce

6
00:00:21,450 --> 00:00:22,260
the flask.

7
00:00:22,380 --> 00:00:24,320
Now we have two pages here.

8
00:00:24,330 --> 00:00:31,380
One points to our domain slash home page and the other points to our domain slash about page.

9
00:00:32,130 --> 00:00:38,370
So what I want to do now is first I want to move these HTML pages.

10
00:00:39,950 --> 00:00:46,490
Out of the templates folder because in templates now I'll insert.

11
00:00:47,850 --> 00:00:56,040
Another home that HTML page so tutorial and about where not related to our project.

12
00:00:56,040 --> 00:00:58,290
So I remove them from templates.

13
00:00:58,320 --> 00:00:59,990
Now in home that is HTML.

14
00:01:00,000 --> 00:01:07,390
I'm going to write some documentation about the API and in main that API.

15
00:01:07,410 --> 00:01:17,010
In here I'm removing that home name so that when the users visit the domain home page without entering

16
00:01:17,010 --> 00:01:22,110
any subdirectory, they can go to this home dot HTML page.

17
00:01:22,110 --> 00:01:23,460
So let's try that.

18
00:01:24,300 --> 00:01:33,840
Let's put some Hello string here and go to Main and this should go and be changed to home dot html.

19
00:01:33,840 --> 00:01:39,480
So it points to that home that email file and run main dot pie.

20
00:01:39,750 --> 00:01:44,730
So if you click over the domain, that should take you to the home page.

21
00:01:45,420 --> 00:01:46,920
So we see the string.

22
00:01:46,920 --> 00:01:47,250
Hello.

23
00:01:47,250 --> 00:01:51,690
So home that HTML has been displayed here on the home page.

24
00:01:52,470 --> 00:01:58,020
Then in the home page we want to put some basic information such as an H one tag.

25
00:02:03,800 --> 00:02:05,180
With a Delta API.

26
00:02:05,210 --> 00:02:08,030
So this should be something about our API.

27
00:02:08,120 --> 00:02:10,699
If I refresh the page should display in here.

28
00:02:11,540 --> 00:02:13,560
So let me put this on the right.

29
00:02:13,580 --> 00:02:14,810
This on the left.

30
00:02:15,500 --> 00:02:17,060
So we see what's going on.

31
00:02:18,560 --> 00:02:22,970
And the titles should also be probably the same, whether there's an API.

32
00:02:23,000 --> 00:02:26,660
So this is the title of this particular web page.

33
00:02:27,350 --> 00:02:33,590
Next, we should think about what URL format are we going to have.

34
00:02:33,620 --> 00:02:36,350
So in this paragraph here.

35
00:02:39,130 --> 00:02:44,380
We can tell the users, the visitors, the type of URL they can enter.

36
00:02:44,770 --> 00:02:49,430
Later on, when we deploy this app on a host on a server.

37
00:02:49,450 --> 00:02:55,390
We're going to get a domain such as example dot com or my python API dot com.

38
00:02:55,630 --> 00:03:05,020
But for now, our domain name is this locally, so we want to tell the user something like I'm copying

39
00:03:05,020 --> 00:03:08,250
this HTP URL.

40
00:03:08,260 --> 00:03:17,080
So we want to tell the user that the URL format will be something like this slash API v one.

41
00:03:17,440 --> 00:03:19,960
So you can write whatever you like here, right?

42
00:03:19,960 --> 00:03:24,310
You can write API or APIs, whatever you like.

43
00:03:24,320 --> 00:03:27,780
So but it makes sense to to write something meaningful.

44
00:03:27,790 --> 00:03:36,850
And so after the Slash, I'm writing V one to basically tell users that this is version one.

45
00:03:36,880 --> 00:03:38,740
Of course, you don't have to write this.

46
00:03:38,740 --> 00:03:39,720
You can live like that.

47
00:03:39,730 --> 00:03:46,360
You can also leave it like that and then continue here with the parameters such as station and date.

48
00:03:46,690 --> 00:03:52,000
But this is a good idea to have API v one and then.

49
00:03:53,870 --> 00:03:57,200
You write the parameters, station and date.

50
00:03:57,230 --> 00:04:04,190
Now, this part, the station and the date will be dynamically entered by the user.

51
00:04:04,220 --> 00:04:10,280
So if you still don't understand what I'm doing, let me write a new paragraph.

52
00:04:12,820 --> 00:04:14,560
Your example.

53
00:04:15,070 --> 00:04:17,839
So here you'll understand what I'm talking about.

54
00:04:17,860 --> 00:04:21,250
So basically, that's a format, that's a formula.

55
00:04:21,250 --> 00:04:34,270
So to say, and this would be an example, let's say station with the code ten and date 1988, 10/25.

56
00:04:34,270 --> 00:04:39,910
So 25th of October 1988.

57
00:04:39,940 --> 00:04:43,180
We are asking for data for this station.

58
00:04:43,960 --> 00:04:46,000
So let me refresh the page here.

59
00:04:46,670 --> 00:04:48,940
Yeah, that's what the user is going to see.

60
00:04:49,300 --> 00:04:58,210
Then they can try this URL, for example, put it on the address bar, and that URL should give data

61
00:04:58,210 --> 00:04:59,980
for this particular station.

62
00:05:00,430 --> 00:05:07,210
Now our main that per script should be able to handle this kind of URL.

63
00:05:07,360 --> 00:05:12,520
So currently this script is only handling this URL.

64
00:05:12,520 --> 00:05:16,320
So the home page and the about page.

65
00:05:16,330 --> 00:05:25,810
Now we don't need an about page, so let's change this about page to API v one.

66
00:05:26,440 --> 00:05:28,780
So api v one.

67
00:05:28,780 --> 00:05:35,800
So when the user visits api v one slash station with this brackets.

68
00:05:35,980 --> 00:05:44,660
So less than greater than this is a special syntax of the URL pattern you place in flask.

69
00:05:44,680 --> 00:05:48,070
And the same goes for date like that.

70
00:05:48,340 --> 00:05:54,790
So this to denote that the users can enter values for these two.

71
00:05:55,150 --> 00:06:03,430
So any value that the user enters, let's suppose the user in the URL there enters for example, this

72
00:06:03,760 --> 00:06:05,050
like place, it's here.

73
00:06:05,200 --> 00:06:08,170
So they place ten for station.

74
00:06:08,170 --> 00:06:18,550
Now that ten that value ten is going to be stored in the station argument here of this function station

75
00:06:18,550 --> 00:06:20,830
and date, right?

76
00:06:20,830 --> 00:06:28,690
So date will go here and station will go in here and then what we will do here, but we will do that

77
00:06:28,690 --> 00:06:29,370
tomorrow.

78
00:06:29,380 --> 00:06:33,430
But I can give you some clue now to help you understand what's going on.

79
00:06:33,430 --> 00:06:41,770
So in here, then we will do something like the F is equal to pandas, Dot reads CSV and we're going

80
00:06:41,770 --> 00:06:48,700
to read our data which contain all the historical weather data, and we're going to get this data and

81
00:06:48,700 --> 00:06:57,790
then we're going to get the temperature for a particular station, for that station, let's say station

82
00:06:57,790 --> 00:07:04,690
like that for a particular data, I'm going to show you the exact syntax, but for now, I'm just trying

83
00:07:04,690 --> 00:07:06,370
for you to understand what's going on.

84
00:07:06,370 --> 00:07:13,480
So we're going to get a temperature and then we're going to return the temperature here on the website

85
00:07:13,480 --> 00:07:17,320
or the web page when the user clicks that URL.

86
00:07:18,130 --> 00:07:26,230
So basically, let's suppose for now that we were able to extract the temperature of 23.

87
00:07:26,680 --> 00:07:31,750
So we are just supposing the temperature is 23, I'm hard coding this value.

88
00:07:31,840 --> 00:07:37,510
Of course we will get it from the actual data, but for now let's keep things simple.

89
00:07:37,810 --> 00:07:44,890
So once we have the temperature, then we can return the temperature directly like that.

90
00:07:45,430 --> 00:07:46,690
Let's give it a try.

91
00:07:46,840 --> 00:07:49,120
Save the main that spy file.

92
00:07:49,210 --> 00:07:52,210
Go here, enter that URL.

93
00:07:53,110 --> 00:08:01,150
If you get this error, it says that the return type must be a string dict list with headers etc. but

94
00:08:01,150 --> 00:08:09,490
we returns an integer here so you can simply convert this into a string, refresh the page and that's

95
00:08:09,490 --> 00:08:10,150
what we get.

96
00:08:10,150 --> 00:08:11,110
23.

97
00:08:11,980 --> 00:08:19,810
So when the users ask for a particular station and a particular date, we will calculate will find out

98
00:08:19,810 --> 00:08:24,370
what the temperature was at that particular date for that station and return it here.

99
00:08:25,270 --> 00:08:35,169
But a better idea would be to construct a dictionary here so something like station and tell the user

100
00:08:35,169 --> 00:08:38,530
what station they chose and then date.

101
00:08:38,530 --> 00:08:40,390
So this is good to have.

102
00:08:40,390 --> 00:08:47,920
It's not necessary, but it's good to give the users a complete dictionary, also telling them what

103
00:08:47,920 --> 00:08:48,760
they chose.

104
00:08:48,760 --> 00:08:53,620
So they have a complete view of the data and the date as well.

105
00:08:53,620 --> 00:08:58,570
So the station is this variable date is that variable.

106
00:08:59,500 --> 00:09:07,630
And finally, temperature, which is equal to the temperature value.

107
00:09:07,630 --> 00:09:09,550
So these are strings, right?

108
00:09:09,580 --> 00:09:11,230
These are variables.

109
00:09:11,230 --> 00:09:11,530
Don't.

110
00:09:11,650 --> 00:09:14,710
Infuse them and refresh.

111
00:09:15,580 --> 00:09:17,770
Save first refresh.

112
00:09:18,430 --> 00:09:22,330
And now we finally get some JSON data here.

113
00:09:22,870 --> 00:09:27,710
So that's the date and that's the actual date that the user entered in the URL.

114
00:09:27,730 --> 00:09:32,260
So if I change this to 26 reloads, we get 26.

115
00:09:33,130 --> 00:09:38,650
If I change the station to 20, we get 20 for the station.

116
00:09:39,070 --> 00:09:45,800
Of course, the temperature will also be dynamically calculated for every load of the page.

117
00:09:45,820 --> 00:09:47,710
But for now it's just static.

118
00:09:47,920 --> 00:09:57,010
So now we have this delta, and as you saw in the previous app where we access the new API data, you

119
00:09:57,010 --> 00:10:03,880
can build any app you can imagine to extract these data and then maybe show those data on a website

120
00:10:03,880 --> 00:10:09,200
or send them by email, construct some graphs with the temperature values of different days.

121
00:10:09,220 --> 00:10:10,750
You can do anything.

122
00:10:10,810 --> 00:10:14,400
So that was about the tutorials for today.

123
00:10:14,410 --> 00:10:17,140
We focused on FLASK.

124
00:10:18,210 --> 00:10:25,770
Now, just before I close this video, I want to do a last change here for today in the app.

125
00:10:26,610 --> 00:10:39,810
So it's a good practice to not use websites here as a name for the Flask app, but to use name name

126
00:10:39,810 --> 00:10:41,670
is a special variable.

127
00:10:44,090 --> 00:10:46,970
I want to demonstrate you what exactly name is.

128
00:10:47,000 --> 00:10:48,310
I'll create a file.

129
00:10:48,320 --> 00:10:49,180
A spy.

130
00:10:49,220 --> 00:10:53,720
You don't have to create these files, so I'll delete them.

131
00:10:54,080 --> 00:11:04,070
So if I print name here and I execute this ADP file, I'm going to get main as output.

132
00:11:04,100 --> 00:11:07,390
So this variable contains this string.

133
00:11:07,400 --> 00:11:10,190
Underscore, underscore, main, underscore, underscore.

134
00:11:11,000 --> 00:11:13,250
Now, if I create a second.

135
00:11:15,460 --> 00:11:17,590
Be that p file.

136
00:11:17,590 --> 00:11:23,250
And here I import a and then I execute b that p.

137
00:11:24,620 --> 00:11:27,320
We're going to get a output.

138
00:11:27,620 --> 00:11:35,930
So what happens is that when I execute B inside B, we are importing A, But when A is imported, A

139
00:11:35,930 --> 00:11:39,920
is executed, that means print name is executed.

140
00:11:39,950 --> 00:11:44,360
So in this case, name had the value of a.

141
00:11:45,170 --> 00:11:53,510
So in other words, when this a script is imported from some other script, the value of the name variable

142
00:11:53,510 --> 00:11:57,590
will have the value of the name of the script.

143
00:11:57,860 --> 00:12:00,740
But when the script is executed directly.

144
00:12:03,490 --> 00:12:06,190
The value of name will be main.

145
00:12:06,940 --> 00:12:15,460
We can take advantage of this fact in here and say that if.

146
00:12:17,150 --> 00:12:21,810
Name is equal to Maine.

147
00:12:23,750 --> 00:12:26,930
Then we want to run the Flask app.

148
00:12:27,290 --> 00:12:36,650
In other words, we only want to run this flask app when this main Looper script is executed directly.

149
00:12:36,950 --> 00:12:47,630
But if we are importing this script from some other scripts, let's say we want to import Main from

150
00:12:47,630 --> 00:12:48,670
this script.

151
00:12:48,680 --> 00:12:56,930
In that case, our purpose perhaps is to use some functions of the main script, which we may define

152
00:12:56,930 --> 00:12:57,800
later on.

153
00:12:57,860 --> 00:13:02,210
So our purpose is not to run this app, right?

154
00:13:02,690 --> 00:13:10,190
If we import that app from somewhere, our purpose is just to use some elements of that app.

155
00:13:10,400 --> 00:13:13,640
So that's why we have this condition here.

156
00:13:13,640 --> 00:13:22,280
So we only run the websites when this script is executed directly and not when the script is imported

157
00:13:22,280 --> 00:13:23,360
from somewhere else.

158
00:13:23,810 --> 00:13:29,060
That's the entire purpose of this expression and that's name variable.

159
00:13:29,240 --> 00:13:31,310
So this is a common practice.

160
00:13:31,700 --> 00:13:33,120
And see how that sits.

161
00:13:33,140 --> 00:13:35,120
Let's do some reformatting.

162
00:13:35,120 --> 00:13:41,570
So this needs to break lines here to be more readable according to the coding styles.

163
00:13:41,930 --> 00:13:43,190
And that's it.

164
00:13:43,910 --> 00:13:46,970
I'll delete the two A and B files.

165
00:13:47,780 --> 00:13:51,710
Then I will enable version control.

166
00:13:51,710 --> 00:13:58,580
VCs enable version control so that we can commit our first changes.

167
00:13:59,120 --> 00:14:02,750
So let's create a dot get ignore file.

168
00:14:07,120 --> 00:14:12,310
Add it to the repository then and that idea will be excluded.

169
00:14:13,600 --> 00:14:21,100
Then we want to add to the repository, the static folder, the templates folder get ignored and main

170
00:14:21,100 --> 00:14:30,760
that py about and tutorial that HTML were files where we did some trials and simple examples so they

171
00:14:30,760 --> 00:14:32,580
are not related to the project.

172
00:14:32,590 --> 00:14:35,740
Therefore I will not add them to the tracking.

173
00:14:35,980 --> 00:14:41,080
So with that right click go to get an add.

174
00:14:41,830 --> 00:14:47,710
So all these files are in green now and they are ready to be committed.

175
00:14:49,760 --> 00:14:51,830
So this is the 29.

176
00:14:54,390 --> 00:14:56,030
And this is the initial commit.

177
00:14:56,040 --> 00:15:01,380
So commit the changes and we're done with the videos, with the tools for today.

178
00:15:01,470 --> 00:15:02,130
Thanks a lot.