1
00:00:00,000 --> 00:00:02,455
Hi, welcome back. I'm excited to show you now

2
00:00:02,479 --> 00:00:06,202
how to deploy your web app on PythonAnywhere.

3
00:00:06,349 --> 00:00:08,190
So this is my PythonAnywhere

4
00:00:08,190 --> 00:00:10,830
account, and I am in the Dashboard

5
00:00:10,855 --> 00:00:13,746
section currently, you want to go to Web.

6
00:00:13,770 --> 00:00:16,329
[No audio]

7
00:00:16,354 --> 00:00:18,420
And there you want to create a new

8
00:00:18,450 --> 00:00:22,230
web app, and you get this message here,

9
00:00:22,230 --> 00:00:25,200
so PythonAnywhere is letting you know

10
00:00:25,200 --> 00:00:28,440
that you cannot have a custom domain

11
00:00:28,440 --> 00:00:32,850
name, let's say, ardit.com. Because

12
00:00:32,850 --> 00:00:36,240
this is a free account. If you want a

13
00:00:36,270 --> 00:00:38,730
custom domain name, then you want to pay

14
00:00:38,755 --> 00:00:41,365
to get one of the pre-paid accounts.

15
00:00:41,430 --> 00:00:45,720
First, though, you want to find a domain

16
00:00:46,020 --> 00:00:49,380
provider to buy a domain name. So if you

17
00:00:49,380 --> 00:00:51,600
want to buy the domain name example.com,

18
00:00:51,600 --> 00:00:54,870
for example, you would want to go to

19
00:00:55,115 --> 00:00:57,455
maybe Namecheap, Namecheap is I think

20
00:00:57,480 --> 00:01:00,960
the best one to get domain names. So

21
00:01:00,960 --> 00:01:04,470
namecheap.com, and once you buy a

22
00:01:04,470 --> 00:01:06,630
domain name there, then you, Namecheap

23
00:01:06,630 --> 00:01:09,210
will give you some DNS names, and those

24
00:01:09,210 --> 00:01:12,688
names you have to put here in a PythonAnywhere

25
00:01:12,712 --> 00:01:13,980
to connect them to your web

26
00:01:13,980 --> 00:01:16,350
app. However, we're not doing that now.

27
00:01:16,620 --> 00:01:18,810
For our purpose, it is enough to have

28
00:01:18,840 --> 00:01:22,350
this kind of domain name, which is

29
00:01:22,380 --> 00:01:23,988
in my case, this one in here.

30
00:01:24,164 --> 00:01:28,255
So ardit12345.pythonanywhere.com.

31
00:01:28,405 --> 00:01:31,401
So this is a subdomain of pythonanywhere.com,

32
00:01:32,141 --> 00:01:34,685
press on Next, and you

33
00:01:34,710 --> 00:01:36,960
have several options, the one we want is

34
00:01:36,960 --> 00:01:40,350
Flask. So you can deploy different types

35
00:01:40,380 --> 00:01:43,830
of web apps on PythonAnywhere. We press

36
00:01:43,855 --> 00:01:47,425
on Flask and Python 3.9 is good to go.

37
00:01:47,615 --> 00:01:50,885
So press on there, and this is now the

38
00:01:50,910 --> 00:01:54,420
entry point of the Flask app. By entry

39
00:01:54,420 --> 00:01:56,587
point, I mean the file that you

40
00:01:56,612 --> 00:01:59,550
run to start the Flask app. So in

41
00:01:59,550 --> 00:02:03,630
our case, it is script1.py.

42
00:02:03,840 --> 00:02:06,390
That's the file that we run with python

43
00:02:06,390 --> 00:02:12,210
script1.py. So don't change that,

44
00:02:12,240 --> 00:02:15,755
just leave it as it is. So press Next for now.

45
00:02:15,779 --> 00:02:18,764
[No audio]

46
00:02:18,789 --> 00:02:21,840
And the app is created. But we

47
00:02:21,840 --> 00:02:25,230
need to add our files to our app. So for

48
00:02:25,230 --> 00:02:27,510
that, you want to go to the Files menu,

49
00:02:29,256 --> 00:02:32,766
and now, here on the left, you can see

50
00:02:32,915 --> 00:02:36,065
mysite, if you click there, you're

51
00:02:36,090 --> 00:02:39,355
going to see the file that PythonAnywhere

52
00:02:39,379 --> 00:02:41,940
created. So this is a entry

53
00:02:41,940 --> 00:02:44,066
point that I was talking about,

54
00:02:44,090 --> 00:02:47,100
flask_app.py, you want to

55
00:02:47,220 --> 00:02:50,850
click there, and you want to delete that

56
00:02:50,850 --> 00:02:55,080
code and paste, copy your own code and

57
00:02:55,080 --> 00:02:58,901
paste your code in there, and press on Save.

58
00:02:58,925 --> 00:03:01,310
[No audio]

59
00:03:01,335 --> 00:03:03,270
So you can see now that we are in

60
00:03:03,270 --> 00:03:07,436
this directory, so /home/ardit12345

61
00:03:07,486 --> 00:03:13,655
so your username, mysite/flask_app.py is our

62
00:03:13,680 --> 00:03:16,860
file. So if you click on mysite, you go

63
00:03:16,860 --> 00:03:19,980
back to the root directory of your

64
00:03:19,980 --> 00:03:23,370
project. So that's the root directory of

65
00:03:23,850 --> 00:03:26,280
PythonAnywhere and this is the root

66
00:03:26,280 --> 00:03:30,300
directory of our local project. So

67
00:03:30,300 --> 00:03:33,390
script1.py is there and then it

68
00:03:33,390 --> 00:03:36,000
has a static and a template folder in

69
00:03:36,000 --> 00:03:39,510
the same root directory. Therefore, in

70
00:03:39,535 --> 00:03:41,935
this mysite root directory, we want to

71
00:03:42,218 --> 00:03:45,278
create a templates folder, so write

72
00:03:45,329 --> 00:03:47,566
templates there and press on New directory.

73
00:03:47,590 --> 00:03:49,975
[No audio]

74
00:03:50,000 --> 00:03:51,780
That will create a new

75
00:03:51,780 --> 00:03:54,240
templates folder. You see now it changed

76
00:03:54,359 --> 00:03:59,087
to this folder. So if you go back to mysite,

77
00:03:59,112 --> 00:04:01,380
you see templates is added in

78
00:04:01,380 --> 00:04:04,260
the directories, flask_app is

79
00:04:04,260 --> 00:04:09,570
also in the same folder mysite, and we

80
00:04:09,570 --> 00:04:13,050
also want to create a static folder

81
00:04:13,050 --> 00:04:16,290
empty, New directory press on that button,

82
00:04:16,320 --> 00:04:19,980
and it should create a static folder. So

83
00:04:19,980 --> 00:04:22,230
go back to mysite, you see static and

84
00:04:22,230 --> 00:04:24,630
templates are there now. So we need to

85
00:04:24,630 --> 00:04:28,590
add our static files, so press on static,

86
00:04:28,620 --> 00:04:31,890
you are on static, inside static now, and you

87
00:04:31,890 --> 00:04:33,654
want to upload

88
00:04:33,678 --> 00:04:35,678
[No audio]

89
00:04:35,703 --> 00:04:37,650
main.css but wait

90
00:04:37,675 --> 00:04:42,055
this is in another folder, css is the

91
00:04:42,090 --> 00:04:45,000
folder. So you want to create inside

92
00:04:45,000 --> 00:04:46,920
static, you want to create a css

93
00:04:47,675 --> 00:04:52,475
directory, press on New directory. Make

94
00:04:52,500 --> 00:04:54,555
sure you are in that directory,

95
00:04:54,579 --> 00:04:58,350
so mysite/static/css and here now

96
00:04:58,350 --> 00:05:01,350
we want to upload a file and that file

97
00:05:01,380 --> 00:05:06,720
is this main.css. So here I am. This

98
00:05:06,720 --> 00:05:09,600
is the project directory with our local

99
00:05:09,600 --> 00:05:12,780
files, under static, under css, we have

100
00:05:12,780 --> 00:05:16,440
main.css, double click, and it will

101
00:05:16,440 --> 00:05:22,155
upload inside css, then go back to mysite,

102
00:05:23,117 --> 00:05:28,325
go to templates, and upload the

103
00:05:28,350 --> 00:05:34,261
files that are inside templates, which is about,

104
00:05:34,285 --> 00:05:38,234
[No audio]

105
00:05:38,259 --> 00:05:41,070
home.html, and the

106
00:05:41,070 --> 00:05:44,880
third one layout.html, these three

107
00:05:44,880 --> 00:05:47,190
are inside templates. So make sure they

108
00:05:47,190 --> 00:05:50,355
are inside the templates, then go back to mysite

109
00:05:50,728 --> 00:05:52,800
and just have a look, if everything

110
00:05:52,800 --> 00:05:55,800
looks good, it looks good to me. One

111
00:05:55,800 --> 00:05:59,160
change you want to make also is that you

112
00:05:59,160 --> 00:06:02,010
want to go to your app, and when your

113
00:06:02,010 --> 00:06:04,050
app is in production, you

114
00:06:04,050 --> 00:06:06,330
want to change this to false. So you

115
00:06:06,330 --> 00:06:09,330
don't want to show visitors Python

116
00:06:09,355 --> 00:06:12,175
errors, because that could make your

117
00:06:12,335 --> 00:06:16,415
app prone to hacking, because people or

118
00:06:16,440 --> 00:06:18,845
hackers will see here the errors of your app

119
00:06:18,870 --> 00:06:21,330
and they may understand how your web app

120
00:06:21,369 --> 00:06:23,709
is structure, and you may also expose

121
00:06:24,335 --> 00:06:27,275
data which you don't want to expose in

122
00:06:27,300 --> 00:06:31,020
those debug error messages that flask

123
00:06:31,020 --> 00:06:36,090
shows. So False and press on Save, and

124
00:06:36,090 --> 00:06:39,450
now we are ready to see our app. But

125
00:06:39,540 --> 00:06:43,200
after we have reloaded the app with this

126
00:06:43,225 --> 00:06:45,715
button, so under Web, the Web section,

127
00:06:46,115 --> 00:06:49,835
press on Reload that button to get the

128
00:06:49,860 --> 00:06:53,550
latest version of the files served by

129
00:06:53,550 --> 00:06:56,670
PythonAnywhere. And then you want to

130
00:06:56,670 --> 00:06:59,160
click on that URL, so that's the URL of

131
00:06:59,160 --> 00:07:03,750
my app, press there, and mysite is

132
00:07:03,750 --> 00:07:06,887
online. So it's working just great.

133
00:07:06,911 --> 00:07:09,022
[No audio]

134
00:07:09,047 --> 00:07:12,240
I hope yours is working too. If not, then

135
00:07:12,240 --> 00:07:17,850
you want to go back to the Web section

136
00:07:17,850 --> 00:07:23,070
and scroll down and look, locate this

137
00:07:23,070 --> 00:07:27,120
Error logs. If you press there, you're

138
00:07:27,120 --> 00:07:30,030
going to see the latest errors that you

139
00:07:30,030 --> 00:07:32,640
got from your web app. So these are

140
00:07:32,640 --> 00:07:35,910
Python errors and try to read them to

141
00:07:35,961 --> 00:07:38,391
understand what's going on. Thanks a lot,

142
00:07:38,490 --> 00:07:40,986
I'll talk to you in the next videos.